InvalidPipeArgument: '[объект объекта]' для канала 'AsyncPipe', невозможно изменить HTML

Question

Я работаю над тем, чтобы заполнить раскрывающийся список приложений, используя Angular и ngrx.Приложение использует раскрывающийся компонент, который используется во всем приложении для раскрывающихся списков, поэтому я не могу его изменить.

HTML-код этого компонента, который является наиболее важным для моего вопроса, выглядит следующим образом:

<option *ngFor="let option of options" [value]="stringifyOption(option.value)" [selected]="option.value === (selectedValue | async)">
   {{option.text}}
</option>

Я получаю параметры выпадающего меню, которые представляют собой массив объектов (dateOptions), из магазина.У каждого объекта есть значение свойства (неделя), которое я получаю и устанавливаю в качестве параметров для раскрывающегося списка.

this.weekDropdownOptions = dateOptions.map(weekObj => weekObj.week);

Ведение журнала weekDropdownOptions в консоли возвращает массив параметров, которые я ожидал, например:

["04/01 - 04/07", "04/08 - 04/14"]

Мой HTML имеет селектор для выпадающего списка и устанавливает [options]="weekDropdownOptions"

Кажется, я не могу обойти эту ошибку:

InvalidPipeArgument:'[Object Object]' для канала 'AsyncPipe'.

Он указывает на раскрывающийся компонент, однако я не могу изменить HTML.Что я могу сделать в своем коде, чтобы заставить это работать?

Answer 1

Асинхронный канал подписывается на Observable или Promise и возвращает последнее выданное им значение.

В соответствии с ошибкой selectedValue является объектом, поэтому вы не можете использовать асинхронный канал.

Answer 2

труба async ожидает Наблюдаемый, а не Объект. было бы интересно посмотреть, как именно заполняется selectedValue и почему он используется с async pipe.

вот пример разницы в stackblitz https://stackblitz.com/edit/angular-vv7pzs