如何给动态值在angularjs NG-模式？ [英] how to give value dynamically for ng-model in angularjs?

问题描述

在这里我动态生成HTML元素使用NG-重复如

 ＆LT; D​​IV NG重复=类型类型＆GT;
    ＆LT;输入类型=复选框NG模型={{类型}}/＆GT; {{类型}}
＆LT; / DIV＆GT;
 

我要为NG-模型类型值。它是可能的，否则我想设置这样的NG-真值

这类型值

 ＆LT; D​​IV NG重复=类型类型＆GT;
    ＆LT;输入类型=复选框NG模型={{类型}}NG-真值={{类型}}/＆GT; {{类型}}
＆LT; / DIV＆GT;
 

解决方案

由于NG-重复为每个类型/项目/迭代子作用域，我们需要的NG-模式为每种类型与父范围相关联，而比个子的范围。做到这一点的方法之一是使用$父：

 ＆LT;输入类型=复选框NG模型=$父【类型】＆GT; {{类型}}
 

如果$ scope.types定义在像@亚历克斯的答案，那么性能 typeOne ， typeTwo 和 typeThree 将出现在父作用域如果单击相应的复选框，而属性的值将为真正。如果选中复选框再次点击，物业仍然存在，并且该值将切换到假。因此，您的code会检查不存在的属性和与设置为true或false存在的价值属性。这是一个有些凌乱。

如果它被选中与否我想preFER至predefine父范围，其中每个对象都具有类型（名称）对象的数组，一个布尔值来表示：

  $ scope.types = [
  {名称：'typeOne'，选择：假}，
  {名称：'typeTwo'，选择：假}，
  {名称：'typeThree'，选择：假}];
 

然后，$父不需要（因为类型的值将是父对象的引用，而不是父属性的（原始）值的副本）：

 ＆LT;输入类型=复选框NG模型=type.selected＆GT; {{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屋！