각도의 여러 옵션에서 동적으로 기본 항목을 선택

Question

여기에 예제가 표시되고 https://docs.angularjs.org/api/ng/directive/select과 같은 값으로 3 개의 선택 항목이 있습니다. 내 옵션에서 다른 값을 선택하려면 어떻게해야합니까?

내가이 있습니다

<li ng-repeat="tarea in tareas"> 
     <input type="checkbox" ng-model="tarea.COMPLETADA" ng-change="updTarea(tarea.ID)"/> 
     <span class="done-{{tarea.COMPLETADA}}" >{{tarea.NAME}} {{tarea.CLASIFICADORES}}</span> 
     <select ng-model="selectedOpt" 
     ng-options="clasificador.NAME for clasificador in clasificadores"> 
     </select> 
     <button class="buttons delete right" ng-click="delTarea(tarea.ID)"> Eliminar</button> 
    </li> 

그래서 내가 5,10,15 옵션을 사용할 수 있고, 내가 tarea.CLASIFICADORES에있는 값으로 선택한 항목을 만들고 싶어, 나는이

으로 시도 나는 내 NG 반복에있는 값으로 동적으로 내 옵션에서 다른 선택한 항목을 만들 수있는 방법

$scope.selectedOpt = $scope.clasificadores[1] 

하지만 예처럼 같은 값을 가진 모든 옵션을 만들 ...

이브 아이템?

은 내가

내 문제는 tarea.CLASIFICADORES와 기본 선택 항목을 설정하는 것입니다 ... 아약스로 데이터를로드합니다. 예를 들어 분류자를 가지고있는 할 일 목록이 있습니다. 페이지가로드 될 때 기본적으로 내 데이터베이스 값 분류기를 선택하기 위해 ng-options를 사용합니다.

Answer 1

문제는 모든 범위에 동일한 범위 변수를 사용한다는 것입니다. 선택. 이처럼 너무 배열에서 선택한 옵션을 저장할 수 :이 예에서

function TestCtrl($scope) { 
 
    $scope.items = [ 
 
    { id: 1, class: 1 }, 
 
    { id: 2, class: 2 }, 
 
    { id: 3, class: 1 }, 
 
    ]; 
 
    $scope.classes = [ 
 
    { name: "class 1", id: 1}, 
 
    { name: "class 2", id: 2}, 
 
    { name: "class 3", id: 3} 
 
    ]; 
 
    };

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<div ng-app> 
 
    <div ng-controller="TestCtrl"> 
 
    <div ng-repeat="currentItem in items"> 
 
     <select ng-model="selectedClass[$index]" ng-init="selectedClass[$index]=(classes|filter:{id: currentItem.class})[0]" ng-options="class.name for class in classes track by class.id" > 
 
     </select> 
 
     selected class: {{selectedClass[$index]}} 
 
    </div> 
 
    </div> 
 
</div>

내가 NG 반복 지침에 의해 설정된 변수 $ 인덱스의 사용을. 이름에서 알 수 있듯이 반복 루프의 현재 색인이 포함되어 있습니다.

는 각 입력 선택에 대한 기본 값을 설정, 그래서 나는 코드 조각을 업데이트

UPDATE.

이제 서로 다른 항목에 해당 클래스의 ID가있는 필드가 포함됩니다. 선택 입력을 ng-init으로 초기화합니다. 이 지시어로 현재 항목에 대해 선택된 값인 selectedClass[$index]을 설정했습니다. 우리는 아이템의 속성으로서 class-id만을 가지고 있기 때문에 나는 필터를 사용하여 id가있는 해당 클래스 객체를 찾는다. (classes|filter:{id: currentItem.class})[0]

각 필터의 ​​클래스를 완전하게 설정할 수있다. id 대신 class-object를 사용합니다.