javascript - Angular 组件中的依赖注入(inject)，如指令

Question

这是我习惯用 Angular Directive(指令)做的一件事

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
    };
}]);

我越来越喜欢使用 Template Cache 在我的指令模板中注入(inject) HTML 内容。现在 Angular 1.5 有一个所有酷 child 都在使用的新东西，叫做 component()在组件本身(而不是 Controller )中注入(inject)东西？

在这种情况下，您可以看到我将 $templateCache 依赖项注入(inject)到 login 指令中。我如何将这个指令重写为一个组件？ (记住我希望在 templateUrl 上使用 $templateCache)

Answer 1

好吧，在 Angular 1.5 组件中，template 属性可以是一个函数，并且这个函数是可注入(inject)的 (documentation)。

所以，你可以使用类似的东西:

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

来自谷歌搜索的几个链接:one和 two .

希望对您有所帮助。