Блог

В моем штате используется пользовательская сортировка:

 export function sort(a: Item, b: Item): number {
    return a.isabstract === b.isabstract ? a.name.localeCompare(b.name) : a.isabstract ? 1 : -1;
}

export const adapter: EntityAdapter<Item> = createEntityAdapter<Item>({
    sortComparer: sort,
});
 

А затем в своем редукторе я делаю обновление:

 on(ItemActions.getExtendedDataSuccess, (state, { data }) => {
    const update: UpdateStr<Item> = {
        id: data.itemid,
        changes: { extendeddata: data.extendeddata },
    };
    return adapter.updateOne(update, state);
}),
 

Когда элемент обновляется, я вижу, что sort метод вызывается должным образом.

В моем компоненте.ts у меня есть:

 allitems: Array<Item>;
private items$: Observable<Dictionary<Item>> = this.coreSelectService.itemList$;

...

this.items$.pipe(takeWhile(() => this.alive)).subscribe(i => {
    this.allitems = Object.values(i).filter(m => m.id !== "exclude");
});
 

И в моем component.html:

 <div *ngFor="let item of allitems">
    {{ item.name }}
</div>
 

При первой загрузке item буквы s расположены в правильном порядке, упорядочены по имени, с абстрактными элементами в нижней части списка, такими как:

• Предмет
• B Пункт
• Z Пункт
• Абстрактный Пункт

Однако, если я затем инициирую getExtendedDataSuccess для «Элемента», произойдет обновление, сортировка произойдет в редукторе, но в моем компоненте обновленный элемент перейдет в конец списка, например:

• B Пункт
• Z Пункт
• Абстрактный Пункт
• Предмет

Такое ощущение, что добавление другого вида в компонент должно быть избыточным, но я не понимаю, почему здесь меняется порядок?

Какие-нибудь советы, пожалуйста?