Ъглово асинхронизиране и събитие неочаквано преоценяващи наблюдаеми - ъглови, събития, асинхронни, наблюдаеми

Моят компонент използва горещ BehaviorSubject, за да наблюдава колекция, изтеглена чрез http, но за простота просто ще създам основен списък, задвижван от BehaviorSubject.

[Изрезка]

Това работи точно както се очакваше.

Нека да направим нещо с резултата, да добавим събитие към елементите в списъка (кликване или преместване с мишката и т.н.)

 <li
*ngFor="let label of labels | async"
(mouseover)="listMouseover()"
>

<span>{{convertString(label.title)}}</span>

</li>

...

convertString(s:string) {

console.log("evaluating string", s);
return s + "!";

}

Какво ще спазвате (!) е, че поглъщателят за Observable сега е ударен всеки път, когато се задейства всяко събитие и (по-лошо) целият списък е възстановен. Ако това е скъпо, това може да е проблем, особено за нещо като мишката.

[Редактиране - частта за синхронизиране не е подходяща, се случва с който и да е списък]

Как да смекчите това поведение, особено ако обратът е скъп?

Благодаря. Пънкър тук.

Отговори:

0 за отговор № 1

На твоят *ngFor използвай trackBy.

https://angular.io/docs/ts/latest/guide/template-syntax.html (Ctrl + F trackBy).

Това ще ви позволи да зададете идентификатор, така че Angular да не разруши и пресъздава елементите DOM, ако идентификаторът все още е налице.

За наблюдаващия проблем можете да създадете прост кеш, така че да не се налага скъпа операция, когато събитието бъде уволнено.

Един такъв пример е тук:

http://www.syntaxsuccess.com/viewarticle/caching-with-rxjs-observables-in-angular-2.0

---