Làm thế nào để ngăn chặn AngularJS ràng buộc đệ quy?

Question

tôi có một lựa chọn:

<select ng-model="p.value" ng-options="q for q in p.value"> 
<option value="">Select an animation</option> 
</select> 

đâu p.value là ['AAAAA', 'BBBBB', 'CCCCC'] nhưng khi tôi chọn một tùy chọn các bản cập nhật lựa chọn và thể hiện một loạt mới của các tùy chọn như:

<option>A</option> 
<option>A</option> 
<option>A</option> 
<option>A</option> 
<option>A</option> 

Tôi đã rõ ràng là cấu trúc điều sai trái bằng cách sử dụng cùng một giá trị trong mô hình và tùy chọn. Cách chính xác để làm việc là gì?

Answer 1

Bạn cần phải tách biệt các mảng của các mặt hàng và các mô hình

<div ng-app ng-controller="MyCtrl"> 
    <select ng-model="p.selected" ng-options="q for q in p.value"> 
     <option value="">Select an animation</option> 
    </select> 
    {{p.selected}} 
</div> 

function MyCtrl($scope) { 

    $scope.p = { 
     value: ['AAAAA', 'BBBBB', 'CCCCC'], 
     selected : null 
    }; 
} 

gì đang xảy ra trong ví dụ của bạn là ngay sau khi bạn chọn AAAAAp.value tại tham chiếu đến một danh sách các nhân vật và kể từ ng-options bị ràng buộc vào cùng một thuộc tính $scope danh sách thả xuống cập nhật và tạo ra kết quả bạn đang thấy.

Example on jsfiddle