这个问题与Trigger ngChange from custom directive类似,但建议的解决方案不够好,无法考虑。
我正在使用AngularJS 1.4.7。我的指令定义为:
(function () {
"use strict";
angular.module('myModule')
.directive('myDatePicker', ['$filter', function ($filter) {
return {
restrict: 'A',
require: 'ngModel',
scope: {
dateFormat: '@',
ngModel: '='
},
link: function ($scope, $element, $attrs, ngModelCtrl) {
$element.datepicker({
onSelect: function (dateText) { // it will be something like '7 Apr, 2017'
// but I want to display the time as well
dateText += ' 18:26:00 PM'; // for simplicity, let's hard code it
$scope.$apply(function () {
ngModelCtrl.$setViewValue(dateText);
});
},
dateFormat: $scope.dateFormat,
beforeShowDay: beforeShowDay
});
function beforeShowDay(date)
{
return [true, ""];
}
}
};
}]);
}());
它使用jQueryUI的DatePicker。我的HTML标记:
<input type="text" class="form-control"
name="birthDate"
my-date-picker
date-format="d M, yy"
data-ng-model="onesBirthday"
ng-change="vm.onBirthDateChange(currentPlayer)"
/>
为简单起见,我会跳过我的Ng控制器,没关系。
嗯,从选择器中选择一个日期后触发onBirthDateChange()处理程序,但输入的值永远不会是'2017年4月7日18:26:00 PM'。所以,我将onSelect()方法更改为:
onSelect: function (dateText) { // it will be something like '7 Apr, 2017'
// but I want to display the time as well
dateText += ' 18:26:00 PM'; // for simplicity, let's hard code it
ngModelCtrl.$viewValue = dateText;
ngModelCtrl.$render();
$scope.ngModel = ngModelCtrl.$modelValue = dateText;
$element.change();
}
它确实会改变输入控件的值,但是,从不触发ngChange,onBirthDateChange()永远不会运行。
我想念什么?感谢。
背景
$ setViewValue(dateText)没有将视图的值更改为dateText的原因可能是它失败了一些内部验证,因为它没有时间部分,而且传递的字符串有。