angular-ui / ui-router, ¿cómo puedo inyectar una vista parcial usando $ stateProvider?

Estoy tratando de inyectar un panel para editarlo, dependiendo de si el espectador es el propietario o no. En este momento, estoy teniendo problemas para inyectar el panel / vista parcial en el html. Quiero que mis composiciones / vistas / vista.html sean la página html 'base', donde se inyecta el parcial. Luego, la vista parcial está en composiciones / vistas / parciales / vistas.tools.html. ¿Alguien ve algo mal con mi $ stateProvider que explicaría por qué no puedo inyectar mi parcial en mi views.html?

Aquí está mi $ stateProvider:

$stateProvider
        .state('all compositions', {
            url: '/compositions/recent',
            templateUrl: 'compositions/views/list.html'
        }). 
          state('view', {
                url: '/compositions/view/:compositionId',
                views: {
                'theTool':{
                 templateUrl:'compositions/views/partials/view.tool.html'   ,
                    controller: 'CompositionsController'
                }
                },
                templateUrl: 'compositions/views/view.html',
                controller: 'CompositionsController',

            }). //other states here

este es mi marcado para mi view.html (html principal)

<div ui-view="theTool"></div>
<section data-ng-controller="CompositionsController" data-ng-init="findOne()">
    <h2>{{composition.title}}</h2>
    <div ng-bind-html="trustedContent"></div>
</section>

Cualquier ayuda o consejo es muy apreciado. Gracias

Respuestas a la pregunta(1)

Su respuesta a la pregunta