绑定广播无法在Angular中工作

Mar*_*ijn 1 angularjs angular-ui angularjs-scope angularjs-ng-repeat

使用ng-repeat我在编辑表单中显示一些收音机:

<label style="float: left;margin-right: 3px;" data-ng-repeat="gender in genders" data-ng-hide="$first">
    <input type="radio" name="gender"  value="{{gender.Id}}" data-ng-model="customerFormData.customer.Gender.Id" />{{gender.Description}}
</label>
Run Code Online (Sandbox Code Playgroud)

如你所见,我已经应用了'dot practice'.编辑表单是我的详细信息表单上的弹出窗口.在我的详细信息表格中,我有这个:

<tr>
    <td>Gender:</td>
    <td>{{ customer.Gender.Description }} </td>
</tr>
Run Code Online (Sandbox Code Playgroud)

编辑表单中的所有绑定都有效,但我无法使性别绑定工作.我认为它与使用ng-repeat继承范围有关.

我也试过用$parent,但结果仍然是一样的:

<label style="float: left;margin-right: 3px;" data-ng-repeat="gender in genders" data-ng-hide="$first">
    <input type="radio" name="gender"  value="{{gender.Id}}" data-ng-model="$parent.customerFormData.customer.Gender.Id" />{{gender.Description}}
</label>
Run Code Online (Sandbox Code Playgroud)

设置初始值有效.当设置女性时,选择女性无线电,当它是男性时,选择男性无线电.

第二个问题是(我认为它与绑定有关),是当选择男性时,我必须在女性上单击两次才能选择女性.

编辑:我创建了一个小提琴来说明我的问题.

Nar*_*etz 7

一种解决方案是使用ng-value(将其内容作为表达式进行评估)并将其设置为整个性别对象,并将ng-model设置为FormData上的Gender对象.这样,当您更改输入时,性别对象将设置为FormData.Gender,您可以同时访问Id和Descr.

<label ng-repeat="gender in genders">    
  <input type="radio" name="gender" ng-value="gender" ng-model="customer.FormData.Gender">
  {{gender.Descr}}
</label>   
Run Code Online (Sandbox Code Playgroud)

http://jsfiddle.net/ADukg/3194/

如果您只想在模型中使用Id,则可以使用:(value将其内容评估为字符串)

<label ng-repeat="gender in genders">
  <input type="radio" name="gender" value="{{gender.Id}}" ng-model="customer.FormData.Gender.Id">
  {{gender.Descr}}
</label>
Run Code Online (Sandbox Code Playgroud)

在控制器中:

$scope.customer.FormData.Gender = {Id : $scope.genders[1].Id};
Run Code Online (Sandbox Code Playgroud)

http://jsfiddle.net/ADukg/3195/

奇怪的是,当您将值和模型设置为Id时,它不起作用,但最初将整个性别对象绑定到性别模型.奇怪的!