ng-repeat 내부에있는 사용자 지정 지시문 안의 AngularJS ng-options

내 사용자 지정 지시문 안에있는 요소 값을 선택하고 가져올 수있는 방법을 찾도록 도와 줄 수 있습니까? 종류 및 상태 :ng-repeat 내부에있는 사용자 지정 지시문 안의 AngularJS ng-options

<body ng-app="myApp"> 
    <div ng-controller="MyCtrl"> 
     <div ng-repeat="category in categories"> 
     {{category.Name}}: 
     <status-selector items="statuses" ng-model="selectedStates[status.Id]"></status-selector> 
     </div> 
    </div> 
    </body>

나는 두 배열이 있습니다

이 내가 가진 것입니다. 각 카테고리는 자체 상태를 가질 수 있습니다. 카테고리의 상태가 선택되면 selectedStatus에 저장되어 결국 [{CategoryId:1,StatusId:2},{CategoryId:2,StatusId:3}]과 같은 값을 갖습니다. selectedStatus가 이미 초기화 된 경우 해당 범주에 대해 선택한 상태를보고 싶습니다. 즉, 값을 입력해야 할뿐만 아니라 읽어야합니다.

myApp 
.controller("MyCtrl", function($scope) { 
    $scope.categories = [{Id:1, Name: "Category1"}, {Id: 2, Name: "Category2"}]; 
    $scope.statuses = [{Id: 1, Name: "Low"}, {Id: 2, Name: "Normal"}, {Id: 3, Name: "High"}] 
    $scope.selectedStates = {}; 
}) 
.directive('statusSelector', function() { 
    return { 
     restrict: 'E', 
     replace: true, 
     scope: { items: '=', ngModel: '='}, 
     template: '<span><select class="select" ng-options="obj.Id as obj.Name for obj in items" ng-model="ngModel"></select></span>', 
     link: function(scope, element, attrs) { 
     } 
    } 
});

감사합니다.

데모 : Fiddle

출처

2013-03-23 Antipod

Arun P Johny에게 감사드립니다. Fiddle의 데모는 문제가 [status.Id]에 있음을 이해하는 데 도움이되었지만 [category.Id]를 사용해야합니다. 감사! – Antipod

당신은 ng-model로 자신의 카테고리 모델이 있어야합니다. 아마 더 이해가됩니다.

<status-selector items="statuses" ng-model="category.Status"></status-selector>

그냥 JSON에 가득 Status을 가지고, 상태를 설정합니다.

// ... 
.controller("MyCtrl", function($scope) { 
    $scope.categories = [{Id:1, Name: "Category1", Status: 1}, {Id: 2, Name: "Category2"}]; 
// ...

Obviouslly, 그냥 category.Status 속성을 잡아, 사용자의 선택을 얻을 수 있습니다. 다음은 updated fiddle입니다.

또한 측면 팁입니다. 당신은 파스칼 사건에 익숙한 닷넷 배경에서 온 것처럼 보입니다. javascript에서는 낙타의 경우를 사용하는 것이 상식이므로 {Id: ..., Status: ...} 대신 {id: ..., status: ...}이 표시됩니다.

출처

2013-03-23 12:40:57

ng-repeat 내부에있는 사용자 지정 지시문 안의 AngularJS ng-options

답변

관련 문제