[英]ANgular Directives in a separate JS file?
我有這個ngFocused指令在工作,但是我想將其放入自己的js文件中。 我該如何接線呢?
var appObject = angular
.module('app', ['ngAnimate'])
.directive('ngFocused', [
function() {
var FOCUS_CLASS = "focused";
return {
restrict: 'A', //Attribute only
require: 'ngModel',
link: function(scope, element, attrs, ctrl) {
ctrl.$focused = false;
element.bind('focus', function(evt) {
element.addClass(FOCUS_CLASS);
scope.$apply(function() { ctrl.$focused = true; });
}).bind('blur', function(evt) {
element.removeClass(FOCUS_CLASS);
scope.$apply(function() { ctrl.$focused = false; });
});
}
}
}
]);
只需將它們分成兩個文件即可。 (並且不要忘記使用<script>
標記將新文件引用到html文件中):
// file app.js
var appObject = angular.module('app', ['ngAnimate'])
// file ngFocused.js
appObject.directive('ngFocused', [ function() {
var FOCUS_CLASS = "focused";
return {
restrict: 'A', //Attribute only
require: 'ngModel',
link: function(scope, element, attrs, ctrl) {
ctrl.$focused = false;
element.bind('focus', function(evt) {
element.addClass(FOCUS_CLASS);
scope.$apply(function() { ctrl.$focused = true; });
}).bind('blur', function(evt) {
element.removeClass(FOCUS_CLASS);
scope.$apply(function() { ctrl.$focused = false; });
})
};
}]);
我喜歡IIFE方法。 在您的新文件中:
(function(app) {
app.directive(....)
}(angular.module('app'));
這樣可以將所有對象都保留在全局名稱空間之外。 確保先引用定義角度應用程序的腳本,然后再引用它。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.