设置 $modelValue 而不改变 $viewValue [英] Set $modelValue without changing $viewValue
问题描述
在 angular 1.2 中,我需要能够在不影响 $viewValue
的情况下更新 $modelValue
.我希望内部值是一个值,而用户看到的是另一个值.我遇到的问题是设置 $modelValue
最终在下一个摘要中设置 $viewValue
.我目前的解决方法是使用 $timeout
在下一个摘要中设置 $viewValue
.
In angular 1.2 I need to be able to update the $modelValue
without affecting the $viewValue
. I want the internal value to be one value, while what the user sees to be another. The problem I am having is setting the $modelValue
ends up setting the $viewValue
on the next digest. My current work-around is using $timeout
to set the $viewValue
in the next digest.
//...
link: function(scope, elem, attrs, ctrl) {
//...
var setter = $parse(attrs.ngModel).assign;
scope.$watch(attrs.otherValue, function(){
var viewValue = ctrl.$viewValue;
setter(scope, validate()); // validate returns undefined or value if valid
$timeout(function(){
if(ctrl.$viewValue !== viewValue){
ctrl.$viewValue = viewValue;
ctrl.$render();
}
});
});
//...
}
//...
基本上,当另一个字段在 Angular 1.2 中发生变化时,我想设置一个的内部值
Basically, I want to set the internal value of one with when another field changes in Angular 1.2
Fiddle(使用丑陋的 $timeout
解决方法):http://jsfiddle.net/TheSharpieOne/q1s7Lf7z/1/
Fiddle (with ugly $timeout
workaround): http://jsfiddle.net/TheSharpieOne/q1s7Lf7z/1/
TL;DR
在 $parser
/$formatter
管道之外设置 $modelValue
会改变 $viewValue
,我只想要它更改 $modelValue
(内部值).
TL;DR
Setting $modelValue
outside of $parser
/$formatter
pipelines changes $viewValue
, where I am wanted it to only change $modelValue
(the internal value).
推荐答案
当任何东西触发模型改变时,比如上面例子中的 setter(scope, validate());
,它会触发 $formatters
运行.$formatters
被传递给 $modelValue
并且可以返回一个将用于 $viewValue
的值.知道了这一点,您可以使用一个简单的函数,它只返回格式化程序中的 $viewValue
.这样,以编程方式更新模型将不会影响 $viewValue
,因此不会更改
When anything triggers the model to change, something like setter(scope, validate());
in the example above, it will trigger the $formatters
to run. The $formatters
are passed the $modelValue
and can return a value that will be used for the $viewValue
. Knowing this, you can use a simple function that just returns the $viewValue
in the formatter. With this, updating the model programmatically will not affect the $viewValue
, and thus not change the value that appears in <inputs>
ctrl.$formatters.push(formatter)
function formatter(modelValue){
return ctrl.$viewValue;
}
对于问题中的示例,仅当 $modelValue
为 undefined
时,您才需要返回 $viewValue
.为此,您可以使用它:
For the example in the question, you would want to return the $viewValue
only when the $modelValue
is undefined
. For that you can use this:
ctrl.$formatters.push(formatter)
function formatter(modelValue){
return modelValue === undefined? ctrl.$isEmpty(ctrl.$viewValue)? undefined : ctrl.$viewValue : modelValue;
}
工作示例:http://jsfiddle.net/TheSharpieOne/q1s7Lf7z/17/
这篇关于设置 $modelValue 而不改变 $viewValue的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!