[英]If statement in AngularJs not removing elements after update from 1.0.8
[英]Issues converting from AngularJS Version 1.0.8 to 1.4.2
我有一个可爱的日期下拉列表,适用于AngularJS V1.0.8,我试图使用V1.4.2运行它,但它似乎不想玩球。
这似乎是什么问题? 由于我已经研究过版本的变化但是看不到问题。
我有一个plunker,你可以看到它使用1.0.8工作,然后当你将第5和第8行的版本更改为1.4.2时,它不起作用。
这些字段对于31/02/2000等日期应该无效,这是好的但不是1.4.2
问题是什么?
https://plnkr.co/edit/5ckBkzN6xYEvJvyoO0Ax?p=preview
angular.module('dateApp', []);
angular.module('dateApp').
directive('dateTypeMulti', function () {
return {
require: 'ngModel',
link: function (scope, element, attrs, ngModel) {
ngModel.$render = function () {
angular.extend(scope.$eval(attrs.dateTypeMulti), ngModel.$viewValue);
};
scope.$watch(attrs.dateTypeMulti, function (viewValue) {
ngModel.$setViewValue(viewValue);
}, true);
ngModel.$formatters.push(function (modelValue) {
if (!modelValue) return;
var parts = String(modelValue).split('/');
return {
year: parts[0],
month: parts[1],
day: parts[2]
};
});
ngModel.$parsers.unshift(function (viewValue) {
var isValid = true,
modelValue = '',
date;
if (viewValue) {
date = new Date(viewValue.year, viewValue.month - 1, viewValue.day);
modelValue = [viewValue.year, viewValue.month, viewValue.day].join('/');
if ('//' === modelValue) {
modelValue = '';
} else if (
date.getFullYear() != viewValue.year ||
date.getMonth() != viewValue.month - 1 ||
date.getDate() != viewValue.day) {
isValid = false;
}
}
ngModel.$setValidity('dateTypeMulti', isValid);
return isValid ? modelValue : undefined;
});
}
};
})
谢谢
您的指令在1.3.0-beta.10中停止工作,可能是因为以下更改:
ngModel:如果没有更改,请不要弄脏$ commitViewValue上的输入
由于您使用对象作为视图值:
scope.$watch(attrs.dateTypeMulti, function (viewValue) {
ngModel.$setViewValue(viewValue);
}, true);
将使用相同的对象引用, $commitViewValue
将在解析和验证管道启动之前认为没有任何更改和中止。
$setViewValue
的文档说明:
与标准输入一起使用时,视图值将始终为字符串(在某些情况下,它会被解析为另一种类型,例如输入[date]的Date对象。)但是,自定义控件也可能将对象传递给此方法。 在这种情况下,我们应该在将对象传递给$ setViewValue之前复制该对象。 这是因为ngModel不会对对象进行深度监视,它只会查找身份的更改。 如果只更改对象的属性,则ngModel将不会意识到对象已更改,并且不会调用$ parsers和$ validators管道。 因此,一旦将副本传递给$ setViewValue,就不应该更改副本的属性。 否则,您可能会导致范围上的模型值更改不正确。
更改为使用angular.copy
,它应该工作:
ngModel.$setViewValue(angular.copy(viewValue))
演示: https : //plnkr.co/edit/kSS56n6LlHej25vcjfQq?p = preview
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.