javascript - 在另一个模块中重用 AngularJS 组件(依赖注入(inject))

Question

如何通过依赖注入(inject)重用一个简单的 Angular 组件？

组件:

angular.module("navbar", []).component("nav", function() {
    console.log("component loaded");
});

我想在其他模块 Controller 中使用它:

angular.module('CtrlHome', ['navbar']).controller('HomeController', 
function($rootScope, $scope) {
});

最后在模板中使用它

<nav></nav>

它抛出一个“injector modulerr”错误。我在这里做错了什么？

Answer 1

组件未正确定义。 component注册方法将一个字符串和一个对象作为输入。对象描述组件。所以这是向模块注册组件的正确方法:

angular.module("navbar", []).component("nav", {
    controller: function(){
        console.log("component loaded");
    }
});

您可以包含其他几个属性来描述组件，即 bindings: {}和 template: '<div>Hello, World!</div>' .