Jak dodać opcje do zaznaczenia za pomocą dyrektywy AngularJS?

Question

mam wybrać tag (stosowany do wyboru kraju), które chcę wstępnego wypełnienia z opcji za pomocą dyrektywy:

<select class="countryselect" required ng-model="cust.country"></select> 

Moja dyrektywa idzie jak

return { 
    restrict : "C", 
    link: function postLink(scope, iElement, iAttrs) { 
    var countries = [ 
     ["AND","AD - Andorra","AD"], 
     ["UAE","AE - Vereinigte Arabische Emirate","AE"] 
     ... //loop array and generate opt elements 
     iElement.context.appendChild(opt); 
    } 
    } 

jestem w stanie wypełnić wybierz z dodatkowymi opcjami, ale powiązanie modelu ng nie działa. Nawet jeśli cust.country ma wartość (np. "ZEA"), opcja ta nie jest wybrana.

Jak ustawić wyświetlanie wartości cust.country? Jeśli myślę, że mam tu jakiś problem z timingiem.

Answer 1

Można użyć dyrektywy od Angular JS:

Markup:

<div ng-controller="MainCtrl"> 
<select ng-model="country" ng-options="c.name for c in countries"></select> 
{{country}} 
</div> 

Scenariusz:

app.controller('MainCtrl', function($scope) { 
    $scope.countries = [ 
    {name:'Vereinigte Arabische Emirate', value:'AE'}, 
    {name:'Andorra', value:'AD'}, 
    ]; 

    $scope.country = $scope.countries[1]; 

}); 

Sprawdź Docs Wybierz: Angular Select

EDIT Z DYREKTYWĄ

dyrektywa:

app.directive('sel', function() { 
    return { 
     template: '<select ng-model="selectedValue" ng-options="c.name for c in countries"></select>', 
     restrict: 'E', 
     scope: { 
      selectedValue: '=' 
     }, 
     link: function (scope, elem, attrs) { 
      scope.countries = [{ 
       name: 'Vereinigte Arabische Emirate', 
       value: 'AE' 
      }, { 
       name: 'Andorra', 
       value: 'AD' 
      }, ]; 
      scope.selectedValue = scope.countries[1]; 
     } 
    }; 
}); 

Główny kontroler:

app.controller('MainCtrl', function($scope) { 

    $scope.country={}; 

}) 

Markup:

<div ng-controller="MainCtrl"> 
<sel selected-value="country"></sel> 
{{country}} 
</div> 

Przykład roboczy: EXAMPLE