Question

我在下面有以下代码。当我从house.Rooms中选择单选按钮时，我想将该值设置为house.SelectedRoom。我知道ng-repeat有一个子作用域，我已经尝试了从$ parent.SelectedRoom到$ parent.house.SelectedRoom的所有操作，但似乎没有在父对象上设置该属性。尚未设置{{house.SelectedRoom}}和{{house.SelectedRoom.Name}}。

<div ng-app="myApp" ng-controller="mainController">
    <div ng-repeat="house in town">
        <span>SelectedRoom = {{house.SelectedRoom.Name}} </span> 
        <div ng-repeat="room in house.Rooms">
            <input type="radio" name="$parent.$index" ng-model="house.SelectedRoom" /> {{room.Name}}
        </div>
        <hr />
    </div>
</div>

Answer 1

期望您的javascript正常运行，您需要使用value属性设置单选按钮的值。您已指定将value（house.SelectedRoom）放在何处，但未指定要在其中放置什么值。

<div ng-app>
  <div ng-controller="mainController">
      <div ng-repeat="house in town">
          <span>SelectedRoom = {{house.SelectedRoom}} </span> 
          <div ng-repeat="room in house.Rooms">
              <input type="radio" name="room.Name" value={{room.Name}} ng-model="house.SelectedRoom"/> {{room.Name}}
          </div>
        <hr />
    </div>
  </div>
</div>

当对$scope.town使用这样的json结构时，此角度代码有效：

$scope.town = [
  {
    Rooms: 
      [
        {
          Name: "Living Room"
        },
        {
          Name: "Kitchen"
        }
      ],
    SelectedRoom: ""
  }
];

Answer 2

让它正常工作。必须使用ng-value将对象绑定到单选按钮的值

<div ng-app="myApp">
    <div ng-controller="mainController">
        <div ng-repeat="house in town">
            <span>SelectedRoom = {{house.SelectedRoom.Name}} </span>
            <div ng-repeat="room in house.Rooms">
                <input type="radio" name="$parent.$index" ng-value="room" ng-model="house.SelectedRoom" /> {{room.Name}}
            </div>
            <hr />
        </div>
    </div>    
</div>

如何在ng-repeat中将父项上的变量绑定到所选值？

2 个答案: