如何给动态值在angularjs NG-模式? [英] how to give value dynamically for ng-model in angularjs?
问题描述
在这里我动态生成HTML元素使用NG-重复如
< DIV NG重复=类型类型>
<输入类型=复选框NG模型={{类型}}/> {{类型}}
< / DIV>
我要为NG-模型类型值。它是可能的,否则我想设置这样的NG-真值
这类型值 < DIV NG重复=类型类型>
<输入类型=复选框NG模型={{类型}}NG-真值={{类型}}/> {{类型}}
< / DIV>
由于NG-重复为每个类型/项目/迭代子作用域,我们需要的NG-模式为每种类型与父范围相关联,而比个子的范围。做到这一点的方法之一是使用$父:
<输入类型=复选框NG模型=$父【类型】> {{类型}}
如果$ scope.types定义在像@亚历克斯的答案,那么性能 typeOne
, typeTwo
和 typeThree
将出现在父作用域如果单击相应的复选框,而属性的值将为真正
。如果选中复选框再次点击,物业仍然存在,并且该值将切换到假
。因此,您的code会检查不存在的属性和与设置为true或false存在的价值属性。这是一个有些凌乱。
如果它被选中与否我想preFER至predefine父范围,其中每个对象都具有类型(名称)对象的数组,一个布尔值来表示:
$ scope.types = [
{名称:'typeOne',选择:假},
{名称:'typeTwo',选择:假},
{名称:'typeThree',选择:假}];
然后,$父不需要(因为类型的值将是父对象的引用,而不是父属性的(原始)值的副本):
<输入类型=复选框NG模型=type.selected> {{type.name}}
又见<一个href=\"http://stackoverflow.com/questions/14049480/what-are-the-nuances-of-scope-prototypal-prototypical-inheritance-in-angularjs/14049482#14049482\">What范围是原型/原型继承在AngularJS的细微差别?了解更多关于NG-重复和子作用域。
here i am generating a html element dynamically using ng-repeat eg
<div ng-repeat="type in types">
<input type="checkbox" ng-model="{{type}}" />{{ type }}
</div>
i want to set the type value for ng-model. is it possible or else i want to set that type value for ng-true-value like this
<div ng-repeat="type in types">
<input type="checkbox" ng-model="{{type}}" ng-true-value="{{type}}" />{{ type }}
</div>
Since ng-repeat creates a child scope for each type/item/iteration, we need to associate the ng-model for each type with the parent scope, rather than the child scope. One way to do that is to use $parent:
<input type="checkbox" ng-model="$parent[type]">{{ type }}
If $scope.types is defined like in @Alex's answer, then properties typeOne
, typeTwo
, and typeThree
will appear on the parent scope if the corresponding checkbox is clicked, and the value of the property will be true
. If a checked checkbox is clicked again, the property remains, and the value will switch to false
. Your code would therefore have to check for non-existent properties and for properties that exist with the value set to true or false. That's a little messy.
I would prefer to predefine an array of objects on the parent scope, where each object has the type (name), and a boolean to indicate if it is selected or not:
$scope.types = [
{name: 'typeOne', selected: false},
{name: 'typeTwo', selected: false},
{name: 'typeThree', selected: false}];
Then, $parent is not required (because the value of "type" will be a reference to the parent object, rather than a copy of the parent property's (primitive) value):
<input type="checkbox" ng-model="type.selected">{{ type.name }}
See also What are the nuances of scope prototypal / prototypical inheritance in AngularJS? to learn more about ng-repeat and child scopes.
这篇关于如何给动态值在angularjs NG-模式?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!