未在加載時檢查AngularJS單選按鈕

Question

我有一個angularJS控制器，該控制器創建帶有項目列表的范圍，並具有所選項目的屬性。 在初始化期間，我創建列表，並將selectedItem屬性設置為列表中的第二個項目。

app.controller('MainCtrl', function($scope) {
  $scope.items = [
    {id: 1, name: "Item 1"},
    {id: 2, name: "Item 2"},
    {id: 3, name: "Item 3"}
    ];

  $scope.selectedItem = $scope.items[1];
});

該視圖是一個列表，其中包含每個項目的復選框。

 <body ng-controller="MainCtrl">
    <div ng-repeat="item in items">
      <label>
        <input type="radio" ng-model="$parent.selectedItem" ng-value="{{item}}" ng-checked="$parent.selectedItem==item">
        {{item.name}}
      </label>
    </div>
    Selected Value: {{selectedItem}}
    <div>
      <button ng-click="selectedItem=items[2]">Select 3</button>
    </div>
  </body>

一切正常，除了在加載視圖時第二個單選按鈕未顯示為選中狀態。 選擇單選按鈕將按預期更改selectedItem。 我還添加了一個按鈕，以演示可以將selectedItem設置為第三個項目，單選按鈕將相應更新。

這是一個演示該問題的工具。

http://plnkr.co/edit/1TbpHgFm5kpa9k3OJtbI?p=preview

Answer 1

您的html模板中有ng-value屬性的錯字，應該是

      <label>
        <input type="radio" ng-model="$parent.selectedItem" ng-value="item">
        {{item.name}}
      </label>

未在加載時檢查AngularJS單選按鈕

問題描述

1 個解決方案

解決方案1
2 已采納 2015-02-11 17:29:12

未在加載時檢查AngularJS單選按鈕

問題描述

1 個解決方案

解決方案1 2 已采納 2015-02-11 17:29:12

解決方案1
2 已采納 2015-02-11 17:29:12