gpt4 book ai didi

angularjs - 如何使用 $injector 加载 angularjs 指令

转载 作者:行者123 更新时间:2023-12-02 03:31:46 24 4
gpt4 key购买 nike

我正在尝试使用由 angular.injector 加载的其他模块的指令,但 angular 无法理解 other_module 中的指令。
在我的主文件中,我声明了我的模块。

  angular.module('blockApp', []).directive('', []);      

在第二个文件中,我尝试添加 angularCharts 作为依赖:

  var otherBlock = angular.module('blockApp');
otherBlock.run(function() {
angular.injector(['ng', 'angularCharts']);
});

然后我使用 angularCharts 的指令,但 angularjs 无法识别它们。我知道我们应该在声明模块时添加依赖模块,但这是特殊情况。

最佳答案

这是一个 plnkr http://plnkr.co/edit/Q5oD65wSvBAemf5BCDL7?p=preview

在这种情况下,您可以使用 $compile(您仍然需要示例中的 $scope,但我猜 $compile 几乎可以回答您的问题),

    var $compile = chartsInjector.get("$compile");
console.log("$compile=",$compile);

var chartsDirective = $compile("<div charts></div>");
console.log(chartsDirective);

...

  var blockapp = angular.module('blockApp', []); 
blockapp.run(function(){
// create a new injector
var chartsInjector = angular.injector(['ng', 'angularCharts']);
console.log("chartsInjector=",chartsInjector);

var $compile = chartsInjector.get("$compile");
console.log("$compile=",$compile);

var chartsDirective = $compile("<div charts></div>");
console.log(chartsDirective);
})

请注意,您将在此处创建多个注入(inject)器。

注入(inject)器 1) 由 ng-app 创建

<body ng-app="blockApp">

注入(inject)器 2) 由 angular.injector() 创建

var chartsInjector = angular.injector(['ng', 'angularCharts']);

完整代码

<!DOCTYPE html>
<html>

<head>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.min.js"></script>
<script type="text/javascript">
// creating the angularcharts
angular.module('angularCharts', []).directive('charts', function(){
return function(){}
});

// creating blockapp
angular.module('blockApp', []).directive('', []);

// retrieving the created blockapp
// NOTE! ng-app will create a new injector for blockapp
var blockapp = angular.module('blockApp', []);
blockapp.run(function(){
// create a new injector
var chartsInjector = angular.injector(['ng', 'angularCharts']);
console.log("chartsInjector=",chartsInjector);

var $compile = chartsInjector.get("$compile");
console.log("$compile=",$compile);

var chartsDirective = $compile("<div charts></div>");
console.log(chartsDirective);
})

</script>
</head>

<body ng-app="blockApp">

</body>

</html>

plnkr http://plnkr.co/edit/Q5oD65wSvBAemf5BCDL7?p=preview

关于angularjs - 如何使用 $injector 加载 angularjs 指令,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26248828/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com