/ / Angular2 Accès au premier élément dans Observable of array - angular, rxjs, observable

Angular2 Accès au premier élément dans Observable of array - angular, rxjs, observable

EDIT: J'ai finalement eu mon problème aller dans un plunk à https://plnkr.co/edit/A2WipJwW9kEhhlh90xMj. Si vous touchez le marché sélectionné puis appuyez sur Entrée, il entrera dans le marketSelectorDropDown méthode dans le fichier market-search.component.ts. Le problème réside dans les quelques lignes situées sous la carte. L'abonnement ne s'exécute jamais tant que l'utilisateur n'a pas cliqué sur la liste déroulante du marché sélectionné. Je ne comprends pas pourquoi. Toute aide est grandement appréciée!

this.markets
.map(markets => {
debugger
if(markets && markets.length > 0) return markets[0];
})
.subscribe((market: Market) => {
debugger
this.pick(market.name)
});

EDIT: Dans les commentaires de celui marqué comme la réponse est la réponse. C'est utiliser un BehaviorSubject. Cela permet aux derniers abonnés d’obtenir le dernier événement envoyé.

Réponses:

3 pour la réponse № 1

Selon la documentation RxJS5

Premier opérateur

Si appelé sans arguments, émet d’abord lepremière valeur de la source Observable, puis complète. Si appelé avec une fonction de prédicat, premier émet la première valeur de la source qui correspond à la spécifiée état. Il peut également falloir une fonction resultSelector pour produire le valeur de sortie de la valeur d'entrée, et une valeur par défaut à émettre en cas la source se termine avant de pouvoir émettre une valeur valide. Jette une erreur si defaultValue n'a pas été fourni et qu'un élément correspondant est pas trouvé.

C'est utile si vous traitez avec Observable à partir d'un événement

Par exemple, n'émettez que le premier clic qui se produit sur le DOM (comme .one dans jQuery)

var clicks = Rx.Observable.fromEvent(document, "click");
var result = clicks.first();
result.subscribe(x => console.log(x));

Ou vous pouvez regarder un autre cas d'utilisation dans cette réponse Angular 2 runOutsideAngular change toujours l'interface utilisateur

Donc ce n'est pas exactement ce que vous voulez, mais vous pouvez l'utiliser comme ceci:

.first(null, arr => arr[0]).subscribe...

et il devrait renvoyer le premier élément souhaité du tableau Exemple Plunker(premier)

Mais je tirerais parti map opérateur pour faire de même:

.map(arr => arr[0]).subscribe...

Exemple Plunker(carte)


0 pour la réponse № 2

Votre exemple ne fonctionne pas car vous utilisez CDN pour RxJS 2, vous avez besoin de RxJS 5 pour cela. J'ai essayé de remplacer le CDN par la version 5 et cela fonctionnait très bien.