在我的角度应用程序中,我将在单个字段上使用不同的指令。
这是我的指示
angular.module('app')
.directive('focusMe', function ($timeout) {
return {
scope: { trigger: '@focusMe' },
link: function (scope, element, attr) {
scope.$watch('trigger', function (value) {
if (value === "true") {
$timeout(function () {
element[0].focus();
});
}
});
}
};
});
和另一个datepicker
.directive('ngDatepicker', function() {
return {
restrict: 'A',
replace: true,
scope: {
ngOptions: '=',
ngModel: '='
},
template: "<div class=\"input-append date\">\n <input type=\"text\"><span class=\"add-on\"><i class=\"icon-th\"></i></span>\n</div>",
link: function(scope, element) {
scope.inputHasFocus = false;
element.datepicker(scope.ngOptions).on('changeDate', function(e) {
var defaultFormat, defaultLanguage, format, language;
defaultFormat = $.fn.datepicker.defaults.format;
format = scope.ngOptions.format || defaultFormat;
defaultLanguage = $.fn.datepicker.defaults.language;
language = scope.ngOptions.language || defaultLanguage;
return scope.$apply(function() {
return scope.ngModel = $.fn.datepicker.DPGlobal.formatDate(e.date, format, language);
});
});
element.find('input').on('focus', function() {
return scope.inputHasFocus = true;
}).on('blur', function() {
return scope.inputHasFocus = false;
});
return scope.$watch('ngModel', function(newValue) {
if (!scope.inputHasFocus) {
return element.datepicker('update', newValue);
}
});
}
};
});
它引发了我的错误
要求新/隔离范围的多个指令
经过数小时的搜索和处理不同的解决方案,我终于理解了这一个same like my problem并改变了我的第一个指令
angular.module('app')
.directive('focusMe', function ($timeout) {
return {
link: function (scope, element, attr) {
scope.$watch(attr.focusMe, function (value) {
if (value === "true") {
$timeout(function () {
element[0].focus();
});
}
});
}
};
})
但现在它不起作用,因为它总是给我value = undefined
,我不知道它为什么会发生。可能是我在这里遗漏了一些东西或者没有正确地做到这一点?
这是我的html,我绑定了它的值
<input type="text" focus-me="{{ DateOfBirthFocus }}" ng-datepicker>
任何形式的帮助将不胜感激。