在单独的JS文件中的角指令?
-
21-12-2019 - |
题
我有这个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; });
});
}
}
}
]);
. 解决方案
我喜欢iife方法。在您的新文件中:
(function(app) {
app.directive(....)
}(angular.module('app'));
.
将使所有对象保留在全局名称空间中。请务必在一个引用它之前将脚本定义Angular应用程序。
其他提示
只是将它们分成两个文件。(并且不要忘记使用<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; });
})
};
}]);
. 不隶属于 StackOverflow