Angular-UI-Router - Inhalt der dynamischen Vorlage erhalten

Question

Ich baue eine eckige App mit angular-UI-Router. Das Backend hat eine REST-API, die mir die URL zu einem Formular gibt, das auf einer Ticket-ID basiert. In app.js möchte ich die Vorlage basierend auf einer Abfrage für diesen REST-Service dynamisch festlegen. Beispiel:

$stateProvider 
    .state('form', { 
    url: '/form/:id', 
    templateProvider: function ($resource, formResolver, $stateParams) { 

     //formResolver calls the REST API with the form id and gets back a URL. 
     return formResolver.resolve($stateParams.id).then(function(url) { 
     return $resource(url).get(); 
     }; 

    }, 
    controller: 'MyCtrl' 
    }); 

Das Problem ist, dass ich ein Versprechen der Rückkehr am Ende und templateProvider erfordern eine Reihe von Inhalten. Was würde Ich mag zu tun, einfach die URL zurück:

$stateProvider 
    .state('form', { 
    url: '/form/:id', 

    //I would like to inject formResolver, but I can't 
    templateUrl: function (stateParams, formResolver) { 
     return formResolver.resolve(stateParams.id); 
    }, 
    controller: 'MyCtrl' 
    }); 

Aber ich weiß nicht Dependency Injection erhalten, wenn templateUrl statt templateProvider nach https://github.com/angular-ui/ui-router/wiki#wiki-templates verwenden, und ich habe immer noch das Problem der es ein Versprechen zurück. Ich denke, vielleicht ist meine einzige Lösung, das Versprechen api nicht zu verwenden.

Answer 1

Es stellte sich heraus, dass etwas mit der Art fehlte, wie ich $resource verwendete. Ich bin mir immer noch nicht sicher was. Von der Quelle für angular-ui-Router aus betrachtet, kann die Funktion ein Versprechen zurückgeben. Ich landete einen Teil des Codes von https://github.com/angular-ui/ui-router/blob/master/src/templateFactory.js Kopieren Sie die folgende erhalten, die funktioniert:

templateProvider: function ($http, formService, $stateParams) { 
     return formService.getFormUrl($stateParams.id).then(function(url) { 
     return $http.get(url); 
     }).then(function(response) { 
     return response.data; 
     }) 

Answer 2

Funktion für templateProvider Versprechen von $ Ressource zurückgeben kann, aber am Ende ist es Zeichenfolge zurückgeben muss.

Wenn es ein Objekt gibt, wäre eine der Lösungen, ein anderes Versprechen zu machen.

templateProvider: function (SomeService, $q) { 

    var defer = $q.defer(); 

    var promise = SomeService.get().$promise; 

    promise.then(function (data) { 
     console.log(data) // let say this is {html: '<p>some template</p>'} 
     defer.resolve(data.html); 
    }); 

    return defer.promise; 
} 

Someservice kehrt $ resource.