angularjs dyrektywa załadunku przed danymi

Question

Powiedzmy mam ładowania zmiennej do $ zakresie z $ http:

$http.get('/teachers/4').success(function(data){ 
    $scope.teacher = data; 
}); 

Mój szablon wykorzystuje te dane:

Teacher: {{teacher.name}} 
<students-view students="teacher.students"></students-view> 

Dyrektywa ta może załadować PRZED nauczyciel kończy ładowanie, ale mój dyrektywa ma kod, który zależy od tablicy teacher.students ładowane:

app.directive('studentsView', function(){ 
    return { 
    scope: { students: '=' }, 
    controller: function($scope){ 
     _.each($scope.students, function(s){ 
     // this is not called if teacher loads after this directive 
     }); 
    } 
    }; 
}); 

Jak to zrobić uzyskać zachowanie, które chcę tutaj? Nie chcę przestać używać $ http i nie chciałbym, jeśli to możliwe, przypisać obietnicy do zakresu.

Answer 1

Użyj zegarka, aby poczekać, aż students będzie dostępny. Gdy będzie dostępny, wywołaj kod, który zależy od niego, a następnie usuń zegarek. Możesz pominąć usunięcie zegarka, jeśli chcesz, aby kod był wykonywany przy każdej zmianie students.

app.directive('studentsView', function(){ 
    return { 
    scope: { students: '=' }, 
    link: function($scope){ 
     var unwatch = $scope.$watch('students', function(newVal, oldVal){ 
     // or $watchCollection if students is an array 
     if (newVal) { 
      init(); 
      // remove the watcher 
      unwatch(); 
     } 
     }); 

     function init(){ 
     _.each($scope.students, function(s){ 
      // do stuff 
     }); 
     } 
    } 
    }; 
}); 

Answer 2

Prawdopodobnie będziesz musiał zrobić jakiś zegarek na students wiedzieć, kiedy jest ona aktualizowana, a następnie uruchomić _.each gdy zegarek jest wyzwalany:

app.directive('studentsView', function(){ 
    return { 
    scope: { students: '=' }, 
    controller: function($scope){ 
     scope.$watch('students', function(newValue, oldValue) { 
     _.each($scope.students, function(s){ 
      // this is not called if teacher loads after this directive 
     });  
     }; 
    } 
    }; 
}); 

Więcej na $watch: https://docs.angularjs.org/api/ng/type/$rootScope.Scope