什么是建在角1.3“解析”确认键新的目的是什么？ [英] What is the purpose of the new built in 'parse' validation key in Angular 1.3?
问题描述
在ngModelController解析管道的行为似乎角1.2和1.3之间已经改变了。我现在总是看到一个新的验证名为解析添加到所有 $错误的一键的对象，每当解析器返回undefined，它将覆盖/替换可能已经设置的所有其他验证密钥。
例如，下面是角1.2.23工作示例 - 尝试输入一些超出范围：
http://jsfiddle.net/8doq0saf/5/
在1.3-RC运行同样的事情给出了不同的结果：
http://jsfiddle.net/1t52s9b2/4/
我还没有能够找到关于这种变化的任何文件。什么是重点解析的目的，以及如何改变我的code找回原来的行为？
angular.module（应用，[]）。指令（'编号'，函数（）{
返回{
要求：'ngModel'，
链接：功能（范围，ELEM，ATTRS，CTRL）{ //有效的数字
Ctrl键。$ parsers.push（函数（值）{
VAR有效= angular.isUndefined（值）||值===''|| isFinite的（值）;
CTRL $ setValidity（'编号'，有效）。
返回有效
？ angular.isUndefined（值）||值==='？未定义：数（值）
：未定义;
}）; Ctrl键。$ parsers.push（函数（值）{
如果（！angular.isDefined（attrs.minNumber））{
返回值;
}
VAR有效= angular.isUndefined（值）||数（值）＆GT; = NUMBER（attrs.minNumber）;
CTRL $ setValidity（'minNumber'，有效）。
返回有效？值：未定义;
}）; Ctrl键。$ parsers.push（函数（值）{
如果（！angular.isDefined（attrs.maxNumber））{
返回值;
}
VAR有效= angular.isUndefined（值）||数（值）＆LT; = NUMBER（attrs.maxNumber）;
CTRL $ setValidity（'MAXNUMBER'，有效）。
返回有效？值：未定义;
}）;
}
};
}）;
在角1.3它们合理化的东西之间做出明确的区分的解析</ em>的和的验证的
解析
角现在会自动添加一个分析键，其价值都$错误收集相应的设置 - 真正如果有返回的解析器未定义，假其他。
对于不可分析值（阿尔法输入了数字，格式错误日期等），我们应该从解析器返回未定义。这将导致角删除已设置的任何错误$钥匙，并与刚替换整个对象{解析：真正} 。没有更多的解析器将运行。该模型将不会被更新。在$解析器阵列现在应该只用于解析。
验证
ngModelController 有一个新的验证器$财产，我们可以指定验证功能。如果解析管道成功这些将仅运行。从这些功能是可解析为数据类型要求的值一个返回假的，但仅仅是无效（字符串太长，数量超出范围等）。验证程序函数的名称将成为在$错误对象的确认键。所有校验器将运行，即使其中一个返回false。如果验证成功模型将只被更新。
这可能是对现有applciations一个重大更改，因为人们经常返回未定义从解析器无效值。这里是我有什么，这是一个典型的例子：
控制$ parsers.push（函数（值）{
如果（！angular.isDefined（attrs.minNumber））{
返回值;
}
VAR有效= angular.isUndefined（值）||数（值）＆GT; = NUMBER（attrs.minNumber）;
CTRL $ setValidity（'minNumber'，有效）。
返回有效？值：未定义;
}）;
根据这项新计划，这应该被移动到一个验证函数来代替：
控制$ validators.minNumber =功能（值）{
返回！值|| ！angular.isDefined（attrs.minNumber）|| （价值＆GT; = NUMBER（attrs.minNumber））;
}）;
下面的一切指令搞掂：
angular.module（应用，[]）。指令（'编号'，函数（）{
返回{
要求：'ngModel'，
链接：功能（范围，ELEM，ATTRS，CTRL）{ //有效的数字
Ctrl键。$ parsers.push（函数（值）{
如果（价值===''）的返回值;
isFinite的返回（值）？数（值）：未定义;
}）; Ctrl键。$ validators.minNumber =功能（值）{
返回！值|| ！angular.isDefined（attrs.minNumber）|| （价值＆GT; = NUMBER（attrs.minNumber））;
}; Ctrl键。$ validators.maxNumber =功能（值）{
返回！值|| ！angular.isDefined（attrs.maxNumber）|| （价值＆LT; = NUMBER（attrs.maxNumber））;
};
}
};
}）;
http://jsfiddle.net/snkesLv4/10/
我真的很喜欢这个新的方式 - 它是干净多了。
。The behavior of the ngModelController parsing pipeline seems to have changed between Angular 1.2 and 1.3. I now always see a new validation key named 'parse' added to all $error objects, and whenever one of the parsers returns undefined, it overrides/replaces all other validation keys that may have been already set.
For instance, here is a working example in Angular 1.2.23 - try entering a number out of range:
http://jsfiddle.net/8doq0saf/5/
The same thing running under 1.3-rc gives a different result:
http://jsfiddle.net/1t52s9b2/4/
I have not yet been able to find any documentation on this change. What is the purpose of the parse key, and how do I change my code to get back the old behavior?
angular.module('app', []).directive('number', function () {
return {
require: 'ngModel',
link: function (scope, elem, attrs, ctrl) {
// valid number
ctrl.$parsers.push(function (value) {
var valid = angular.isUndefined(value) || value === '' || isFinite(value);
ctrl.$setValidity('number', valid);
return valid
? angular.isUndefined(value) || value === '' ? undefined : Number(value)
: undefined;
});
ctrl.$parsers.push(function (value) {
if (!angular.isDefined(attrs.minNumber)) {
return value;
}
var valid = angular.isUndefined(value) || Number(value) >= Number(attrs.minNumber);
ctrl.$setValidity('minNumber', valid);
return valid ? value : undefined;
});
ctrl.$parsers.push(function (value) {
if (!angular.isDefined(attrs.maxNumber)) {
return value;
}
var valid = angular.isUndefined(value) || Number(value) <= Number(attrs.maxNumber);
ctrl.$setValidity('maxNumber', valid);
return valid ? value : undefined;
});
}
};
});
In Angular 1.3 they have rationalized things to make a clean distinction between parsing and validating.
Parsing
Angular now automatically adds a 'parse' key to all $error collections with its value set accordingly - true if any of the parsers returned undefined, false otherwise.
For an unparsable value (alphas entered for a number, badly formatted date, etc), we should return undefined from the parser. This will cause Angular to remove any $error keys already set, and replace the entire object with just { "parse": true }. No more parsers will be run. The model will not be updated. The $parsers array should now only be used for parsing.
Validation
ngModelController has a new $validators property, to which we can assign validation functions. These will only be run if the parsing pipeline was successful. Return false from one of these functions for a value that is parsable as the required datatype, but merely invalid (string too long, number out of range etc). The name of the validator function becomes the validation key in the $error object. All validators will be run, even if one returns false. The model will only be updated if validation is successful.
This is potentially a breaking change for existing applciations, as people frequently returned undefined from parsers for an invalid value. Here is what I had, which is a typical example:
ctrl.$parsers.push(function (value) {
if (!angular.isDefined(attrs.minNumber)) {
return value;
}
var valid = angular.isUndefined(value) || Number(value) >= Number(attrs.minNumber);
ctrl.$setValidity('minNumber', valid);
return valid ? value : undefined;
});
Under this new scheme, this should be moved to a validation function instead:
ctrl.$validators.minNumber = function (value) {
return !value || !angular.isDefined(attrs.minNumber) || (value >= Number(attrs.minNumber));
});
Here is the directive with everything fixed up:
angular.module('app', []).directive('number', function () {
return {
require: 'ngModel',
link: function (scope, elem, attrs, ctrl) {
// valid number
ctrl.$parsers.push(function (value) {
if(value === '') return value;
return isFinite(value) ? Number(value) : undefined;
});
ctrl.$validators.minNumber = function (value) {
return !value || !angular.isDefined(attrs.minNumber) || (value >= Number(attrs.minNumber));
};
ctrl.$validators.maxNumber = function (value) {
return !value || !angular.isDefined(attrs.maxNumber) || (value <= Number(attrs.maxNumber));
};
}
};
});
http://jsfiddle.net/snkesLv4/10/
I really like this new way - it is much cleaner.
这篇关于什么是建在角1.3“解析”确认键新的目的是什么？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
