如何在angularjs中重新定义模块?

时间:2014-09-09 10:24:12

标签: angularjs module

我希望我可以在bootstrap之后将模块附加到主模块。

我发现了这个问题:https://github.com/angular/angular.js/issues/3881,这正是我想要的。

他们说:

  

我不再觉得这是必要的,虽然如果我们重新定义一个模块会看到警告会很好(但即使这在检测过程中也可能有用)

我不确定redefine a module是什么意思,所以我尝试了它作为我的猜测:

HTML

<div ng-controller="Ctrl">
  {{hi }}
  <input ng-model="hi" />
  <button ng-click="say()">Say</button>
  <ul>
    <li phone="{{p}}" ng-repeat='p in ps'></li>
  </ul>
</div>

您可以看到有phone指令。

角度代码

angular.module('ctrl',[])
.controller('Ctrl', ['$scope', function($scope){
  $scope.hi = 'Hi';
  $scope.say = function() {
    alert("Say something");
  };
  $scope.ps = ["1234567890123","001122334455667"];
}]);


angular.module('app', ['ctrl']);

angular.element(document).ready(function () {
    angular.bootstrap(document, ['app']);
});

您可以看到还没有phone定义。

然后我尝试重新定义app模块并附加一个新的phone模块:

angular.module('phone', [])
.directive('phone', function() {
  return {
    restrict: "A",
    scope: {
      p : "@phone"
    },
    link: function(scope,el){
      el.text(scope.p.substr(0,5)+"...");
      el.css("cursor", "pointer");
      el.on("click", function(){
        el.text(scope.p);
        el.css("cursor", "text");
      });
    }
  };
});

setTimeout(function() {
    console.log('redefine module');
    angular.module('app', ['ctrl', 'phone']);
}, 3000);

它将在3秒内运行。

但那还没有奏效。我不确定我的方法是否正确,如何解决?

您可以在此处看到现场演示:http://jsbin.com/xukafo/1/edit


更新:

让我说清楚。我想要附加到主模块的模块是第三方模块,它已经定义了一些模块和指令。由于它很大而且很慢,我想异步加载它,并将它附加到主(bootstrapped)模块。我无法修改该模块的源代码。

已经有一个棘手的解决方案:https://stackoverflow.com/a/18365367/4022015

我曾经尝试过这个解决方案,但它无法通过量角器e2e测试。所以我创建了一个功能请求&#34;附加一个模块&#34;但是告诉已经存在一个(问题中的一个)。人们说我们不需要这个功能,因为我们可以重新定义&#34;一个模块,但我不知道如何重新定义&#34;它。所以有这个问题。

1 个答案:

答案 0 :(得分:2)

重新定义模块意味着,首先定义一个模块:

angular.module('module1', []);

然后在其他地方再次定义它:

angular.module('module1', [])
    .config(...);

虽然目的是添加一个.config块(请注意,使用单个参数调用.module())。

angular.module('module1')
    .config(...);