materialisiert Dropdwon in Angular js nach Ajax-Aufruf

Question

ich eine Masterseite und Kind Seite in MVC

All Js Dateien enthalten sind in Master page.Now in den Kindern Seite habe ich habe zwei Dropdown-Listen, die mit Ajax-Daten zurückgegeben binden werden.

Ich kann sehen, Daten werden in ausgewählten Optionen gefüllt, aber materialisieren CSS nicht erstellt.

HTML

<select data-ng-init="getAllItems()" ng-model="Item[0]" ng-options="Item['title'] for Item in Items track by Item['id']"> 

AJAX

$scope.getAllItems = function() { 
     var result = ItemsFactory(); 
     result.then(function (result) { 

      if (result.success) { 
       $scope.Items= (result.data); 
      } 
     }); 
    } 

ich verwendet habe

$('select').material_select() 

in einer js-Datei, die auf Master-Seite am Ende enthalten ist,

So ist mein Denken die JS, wo ich $ verwende (‚Option‘). Material_select() vor Drop-Down-Populationen geladen wird, aber ich habe es am Ende enthalten,

ich verwalten, es zu bekommen arbeitete

$scope.getAllItems = function() { 
       var result = ItemsFactory(); 
       result.then(function (result) { 

        if (result.success) { 
         $scope.Items= (result.data); 
         $('select').material_select() 
        } 
       }); 
      } 

    $scope.$apply($scope.getAllItems()); 

aber auf der Konsole I Störung erhalte [$ rootScope: inprog]

jede suggestio n. So

Dank

Answer 1

, haben Sie zwei Möglichkeiten:

1) Es stellen sich, Ihre wählen Initialisierung in then fuction. Nicht der gute Weg

$scope.getAllItems = function() { 
    var result = ItemsFactory(); 
    result.then(function (result) { 

     if (result.success) { 
      $scope.Items= (result.data); 

      $('select').material_select(); 

      $scope.$apply(); 
     } 
    }); 
} 

2) eine Richtlinie machen, dass .material_select() wickelt. bessere Weg

.directive('materialSelect', [function(){ 

     return { 
      restrict: 'E', 
      scope: { 
       items: '=' 
      }, 
      link: function(scope, elem attrs) { 

       elem.material_select() 

      } 

     } 

    }]) 

    <material-select items="items"></material-select> 

UPDATE

$scope.getAllItems = function() { 
      var result = ItemsFactory(); 
      result.then(function (result) { 

       if (result.success) { 
        $scope.Items= (result.data); 
        $('select').material_select() 

        $scope.$apply() 
       } 
      }); 
     } 

    $scope.getAllItems();