Angular2 + async pipe: получить несколько значений из одного Observale

Question

У меня есть одна служба, которая возвращает одиночный наблюдаемый. Теперь я ищу правильный/самый эффективный способ получить несколько результатов из этого Observable без написания слишком большого кода.

• MyService возвращает Observable<Array<Foo>>

• MyComponent вызовы myService.getFoos() и должен вывести первые 5 элементов из массива, а общая длина массива, а число элементов не показаны.

Вот мой текущий код:

@Injectable() 
export class MyService { 
    foos = new BehaviorSubject<Array<Foo>>([]); 

    getFoos() { 
    return this.foos.asObservable(); 
    } 
} 



@Component({ 
    template: ` 
    Total: {{ totalCount | async }} 
    Omitted: {{ (totalCount | async) - (maxFiveItems | async).length }} 
    <div *ngFor="let item of maxFiveItems | async"> 
     {{item.bar}} 
    </div> 
    ` 
}) 
export class MyComponent { 
    totalCount: Observable<number>; 
    maxFiveItems: Observable<Array<Foo>>; 

    constructor(myService:MyService) { 
    this.totalCount = myService.getFoos() 
     .map(arr => arr.length); 

    this.maxFiveItems = myService.getFoos() 
     .map(arr => arr.slice(0, 5)); 
    } 
} 

Результат выглядит хорошо, но я использую async трубу 4 раза. Что (насколько я знаю) приведет к 4 Подписям. Это не должно быть нужно вообще я думаю (?)

---

Конечно, я мог бы вручную подписываться в constructor из MyComponent, а затем жить без async труб. Но тогда я должен позаботиться о том, чтобы отказаться от подписки.

Есть ли другой способ справиться с этим?

Answer 1

Нет ничего плохого в том, что вы делаете, полагая, что myService.getFoos() где-то внутри использует оператор share(), поэтому все ваши async трубы имеют одну и ту же подписку на источник. Если вы используете BehaviorSubject, как в этом примере, тогда все в порядке.

Что вы упомянули о подписке на конструктор, это то, что мне сразу пришло в голову. Однако я не вижу ручной отписки в качестве проблемы.