NGRX - Как убедиться, что представление обновляется при каждом изменении состояния? - PullRequest
Новая
       39

NGRX - Как убедиться, что представление обновляется при каждом изменении состояния?

0 голосов
/ 09 ноября 2019

У меня есть представление, которое зависит от 3 переменных, и оно должно обновляться каждый раз при изменении состояния. Я получил значение Observable s от селекторов и использовал их по трубе async в моем шаблоне.

Проблема в том, что иногда состояние изменяется, но view не обновляется. Это происходит примерно каждые 20 раз, когда я обновляю страницу.

Как узнать, что состояние обновляется? Я подписался на store$ и записал значение при любом изменении. Так что иногда я вижу изменения состояния на консоли, но не в виде!

Есть ли способ убедиться, что представление в конце концов отображается правильно?

Код

В моем компоненте: 

    this.homeFacade.loadOrderTypes();
    this.orderTypes$ = this.homeFacade.getOrderTypes();
    this.showRegisterButton$ = this.homeFacade.getRegisterButtonVisibility();

Функция loadOrderTypes отправляет действие для загрузки данных из веб-службы.

Обновление:

Я расширил трубу async и попытался войти в эту трубу. Это журнал, когда представление не обновляется: 

@ngrx/store/update-reducers
12:45:31.729 async-test.pipe.ts:10 Subscribed async test pipe!
12:45:31.742 async-test.pipe.ts:10 Subscribed async test pipe!
12:45:32.236 client:52 [WDS] Live Reloading enabled.
12:45:32.273 home.reducer.ts:39 [Home Page] Load order type start
12:45:32.275 home.reducer.ts:39 [Home Page] Load order type success
12:45:32.277 home.reducer.ts:39 [Home Page] Check order type success

И это журнал, когда представление обновляется: 

@ngrx/store/update-reducers
12:55:15.618 async-test.pipe.ts:10 Subscribed async test pipe!
12:55:15.631 async-test.pipe.ts:10 Subscribed async test pipe!
12:55:16.123 home.reducer.ts:39 [Home Page] Load order type start
12:55:16.126 home.reducer.ts:39 [Home Page] Load order type success
12:55:16.128 home.reducer.ts:39 [Home Page] Check order type success
12:55:16.137 async-test.pipe.ts:10 Subscribed async test pipe!
12:55:16.151 async-test.pipe.ts:10 Subscribed async test pipe!
12:55:16.151 async-test.pipe.ts:10 Subscribed async test pipe!

1 Ответ

0 голосов
/ 09 ноября 2019

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

Если вы сделаете запрос xhr для наблюдаемого, то это может бытьпредставление отображается после получения первого ответа.

Чтобы убедиться в этом, украсьте асинхронный канал. Проверьте ссылку здесь . В конструкторе сделайте запись в журнале и посмотрите, что произойдет первым. Изменение состояния или строительство трубы.

...