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 № 1Selon 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.