1

Ich arbeite an einer App, die Schauspieler Angebote hat. Es gibt Tags und Akteure mit vielen Beziehungen im Backend.AngularJS Kommunikation zwischen Komponenten durch eine Vorlage (mit einem Versprechen)

Ich habe 2 Komponenten und ich möchte zwischen ihnen durch eine Vorlage und nicht gelöstes Versprechen übergeben.

Dies ist die Schauspieler-tag-Detail-Komponente:

angular.module('actorTagDetail').component('actorTagDetail', { 
    templateUrl: 'static/partials/actor-tag-detail/actor-tag-detail.template.html', 
    controller: ['$routeParams', 'ActorTag', 
     function ActorTagDetailController($routeParams, ActorTag) { 


      var self = this; 
      self.actorTag = ActorTag.get({actorTagId: $routeParams.actorTagId}) 

     } 
    ] 
}); 

Der actorTag gibt einen JSON für das ActorTag Objekt aus dem Backend, das wie folgt aussieht:

{ "id": 37, "name": "Oscar Gewinner", "Schauspieler": [ 664, 668, 670, 673, 678, ]}

ich auch eine Schauspieler-Liste Komponente habe, die zum Abrufen einer Schauspieler-Liste aus dem Backend verantwortlich:

angular.module('actorList').component('actorList', { 
    templateUrl: 'static/partials/actor-list/actor-list.template.html', 
    bindings: { 
     pk: '=' 
    }, 
    controller: ['Actor', 
     function ActorListController(Actor) { 
      var self = this; 
      alert(self.pk) 
      self.actors = Actor.query(); 
      self.orderProp = 'name'; 
     } 
    ] 
}); 

In der Vorlage für die Schauspieler-tag-Details Ich bin Versuchen, ein Attribut an die actor-list-Komponente zu übergeben.

Schauspieler-tag-detail.template.html:

<actor-list pk="$ctrl.actorTag.actors"></actor-list> 

Was ich versuche zu erreichen, den Zugang zu den abgerufenen JSON-Daten in der Schauspieler-Liste Komponente hat. Allerdings bekomme ich eine 'nicht aufgelöste Objekt Fehler' anstelle des gewünschten Ergebnisses, wenn ich versuche, in actor-list.component alert(self.pk).Dies passiert, weil, wenn ausgeführt wird, die Daten noch nicht aus dem Back-End abgerufen werden. Ich weiß nicht, wie ich die Situation beheben soll. Gibt es eine Möglichkeit, in der empfangenden Komponente anzugeben, dass die Ausführung erwartet wird, bis das Versprechen gelöst ist und die Daten vom Back-End empfangen wurden?

Oder mache ich es völlig falsch und es gibt eine bessere Möglichkeit, diese Informationen zwischen Komponenten zu übergeben?

+0

ActorTag.get die $ http Versprechen zurückzukehren? – fantarama

+0

@fantarama Nein, es gibt $ resource promise zurück (oder was auch immer ngResource zurückgibt). – Curtwagner1984

+0

$ resource gibt ein leeres Objekt/Array zurück (Abfragemethoden erhalten), die mit dem json-Wert gefüllt werden, wenn $ http promise aufgelöst ist, Sie brauchen einen Beobachter auf actorList controller ... – fantarama

Antwort

1

einen Watcher Verwenden Sie die Objektänderungen zu hören:

function ActorListController($scope, Actor) { 
    var self = this; 
    $scope.$watch(function() { 
     return self.pk; 
    }, function(newValue, oldValue) { 
     if(angular.isObject(newValue) { 
      //alert(self.pk) 
      self.actors = Actor.query(); 
     } 
    } 
} 
Verwandte Themen