因此,我仅使用element就为我的时间选择器提供了一个自定义指令。输入有效,我自定义的标签也起作用,但是我使用的timepicker插件不起作用。我正在为时间选择器使用此插件:http ://timepicker.co/options/ 。
这是我的html:
<apple-timepicker label="Time Picker: " a-id="time" ng-model="fieldTime" ></apple-timepicker>{-fieldTime-}
和我的自定义指令js:
apple.directive('appleTimepicker', function(){
var linker = function (scope, element, attrs, ngModel) {
$(element).timepicker({
timeFormat: 'h:mm p',
interval: 15, // 15 minutes
change: function(time) {
scope.$apply(function() {
// the input field
var element = $(this), text;
// get access to this TimePicker instance
var timepicker = element.timepicker();
text = timepicker.format(time);
ngModel.$setViewValue(text);
});
}
});
};
return {
restrict: 'E',
require: 'ngModel',
template: '<label for="inputTimepicker">{-fieldLabel-}</label>'+
'<div>'+
'<input type="text" id={-fieldId-} ng-model="fieldTime" readonly="true"/>'+
'</div>',
scope: {
fieldLabel: '@label',
fieldId: '@aId',
fieldTime: '=ngModel'
},
controller: ['$scope',function($scope) {
}],
link: linker
};
});
我认为您的链接器功能需要获取输入。不是基本的div元素:
element.find('input').timepicker({
timeFormat: 'h:mm p',
interval: 15, // 15 minutes
change: function (time) {
scope.$apply(function () {
// the input field
var element = $(this);//, text;
// get access to this TimePicker instance
var timepicker = element.timepicker();
var text = timepicker.format(time);
ngModel.$setViewValue(text);
});
}
});
另外,没有理由将元素包装在jquery对象中。它已经包装在一个jQuery lite对象中。
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句