gpt4 book ai didi

javascript - Angular - 通用指令

转载 作者:行者123 更新时间:2023-11-30 15:21:41 25 4
gpt4 key购买 nike

我创建了一个通用的指令,我想在我们网站的任何 Angular 页面中使用它。我不想强制每个页面使用相同的 app 变量。我如何将此指令更改为通用指令,以便它可以作为依赖项添加(当然作为单独的 js 文件包含在内)?

var app = angular.module('myapp', []);

app.directive('helloWorld', function() {
return {
restrict: 'AE',
replace: 'true',
scope: {
name: '@',
},
template: '<h3 >Hello {{name}}</h3> ',

}
};
});

最佳答案

您可以创建一个 common 模块,在其上声明您的指令并将其用作每个应用程序的模块依赖项。通过在您的应用程序模块依赖项上添加该模块,您将能够使用您的指令以及您在 common 模块中声明的每个提供程序。

/common.module.js

;(function() {

var commom = angular.module('common', []);

commom.directive('helloWorld', function() {
return {
restrict: 'AE',
replace: true,
scope: {
name: '@',
},
template: '<h3 >Hello {{name}}</h3> ',
};
});

})();

/index.html

<html>
...
<body ng-app="myapp">

<hello-world name="World"></hello-world>

<script src="angular.min.js"></script>
<script src="common.js"></script>
<script>
var app = angular.module('myapp', ['common']);
</script>
</body>
</html>

关于javascript - Angular - 通用指令,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43640352/

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