Dependency Injection in Winkelkomponenten wie Richtlinien

Question

Hier ist eine Sache, die ich gewohnt bin mit Winkel Richtlinien zu tun

angular.module('app.directives').directive('login', ['$templateCache', function ($templateCache) { 
    return { 
     restrict: 'E', 
     template: $templateCache.get('directives/login/login.html'), 
     controller: 'LoginController as vm', 
     scope: true 
    }; 
}]); 

Ich habe sehr ans Herz gewachsen zu verwenden Template Cache HTML-Inhalt in Vorlage meiner Anweisung zu injizieren. Jetzt mit Angular 1.5 gibt es diese neue Sache, die alle coolen Kinder verwenden, genannt Komponente(), die ich einen Blick gebe, um zu sehen, wenn es wirklich gut ist und ich an diesem sehr beginnenden Teil feststecke: wie man Sachen in den injiziert Komponente selbst (nicht in der Steuerung)?

In diesem Fall können Sie sehen, dass ich in die Anmeldung Direktive die $ templateCache-Abhängigkeit injiziere. Wie würde ich diese Direktive als Komponente umschreiben? (Denken Sie daran, mein Wunsch, $ templateCache über templateUrl zu verwenden)

Answer 1

Nun, in Angular 1.5 Komponenten, template Eigenschaft kann eine Funktion sein und diese Funktion ist injizierbar (documentation).

So können Sie nur so etwas wie verwenden:

... 
template: ['$templateCache', function ($templateCache) { 
    return $templateCache.get('directives/login/login.html') 
}] 
... 

Ein paar Links von Google-Suche: one und two.

Ich hoffe, es wird helfen.

Answer 2

Die Antwort von MaKCblMKo ist richtig, aber denken Sie daran, dass AngularJS zuerst den templateCache überprüfen wird, bevor Sie die Vorlage abrufen. Daher müssen Sie diesen Aufruf nicht in Ihrer Anweisung oder Komponente ausführen.

angular.module('myApp', []) 
.component('myComponent',{ 
    templateUrl: 'yourGulpPattern' 
}) 
.run(function($templateCache) { 
    $templateCache.put('yourGulpPattern', 'This is the content of the template'); 
}); 

https://jsfiddle.net/osbnoebe/6/