Angularjs: nút radio được kiểm tra

Question

Tôi đang cố gắng xây dựng một bộ cấu hình màu trong AngularJS bằng cách sử dụng các nút radio và mọi thứ có vẻ như đang hoạt động, dữ liệu liên kết, v.v ... nhưng Tôi không thể đặt radio màu mặc định nút được kiểm tra. Như tôi thấy trong các tài liệu nếu mô hình ng giống như giá trị radio, đầu vào phải được kiểm tra tự động nhưng tôi không biết nếu nó chỉ hoạt động cho các chuỗi chứ không phải cho các đối tượng.

Đây là HTML:

<div ng-app ng-controller="ThingControl"> 
    <ul > 
     <li ng-repeat="color in colors"> 
      <input type="radio" ng-model="thing.color" value="{{color}}" />{{ color.name }} 
     </li> 
    </ul> 
    Preview: {{ thing }} 
</div> 

Và đây là JS:

function ThingControl($scope){ 
    $scope.colors = [ 
     { name: "White", hex: "#ffffff"}, 
     { name: "Black", hex: "#000000"} 
     ] 

    $scope.thing = { 
     color: $scope.colors[1] 
    } 

} 

Bạn có thể xem ví dụ trước trong fiddle này: http://jsfiddle.net/xWWwT/1/

Cảm ơn rất nhiều trước !

Answer 1

Selection được kết hợp bởi các chuỗi quy định tại Value, vì vậy bạn có thể làm

value="{{color.name}}" 

$scope.thing = { 
    color: $scope.colors[1].name 
} 

hoặc

value="{{color}}" 

$scope.thing = { 
    color: JSON.stringify($scope.colors[1]) 
} 

Như @bertez đề cập, sử dụng ng-value sự là giải pháp tốt nhất.

ng-value="color" 

Answer 2

Bạn đã thử chỉ định ng-thay đổi? Bạn có thể sử dụng một biểu thức để đặt nó được kiểm tra, hãy thử điều này.

<div ng-app ng-controller="ThingControl"> 
<ul > 
    <li ng-repeat="color in colors"> 
     <input type="radio" ng-model="thing.color" value="{{color}}" ng-checked="$index == 0" />{{ color.name }} 
    </li> 
</ul> 
Preview: {{ thing }} 
</div>