Как обновить свойство при загрузке страницы после ngOnInit - PullRequest
1 голос
/ 15 июня 2019

У меня есть приложение Ionic 4, которое вытягивает список из firebase ngOnInit на страницу A. Когда я ухожу со страницы A и обновляю список на другой странице B, то когда я возвращаюсь назад на страницу A, список не отображается.нет обновлений.Я должен закрыть приложение, а затем снова открыть его, чтобы получить обновленный список.Я пробовал несколько разных угловых зацеплений жизненного цикла, но безрезультатно.

Есть ли жизненный цикл при простой загрузке страницы после ее инициализации?Как я могу проверить обновленный список, когда возвращаюсь на эту страницу?

  ngOnInit() {
    this.dataSvc.getItineraries()
    .get()
    .then( itineraryListSnapshot => {
      this.matchItinerary = [];
      itineraryListSnapshot.forEach(snap => {
        this.matchItinerary.push({
          id: snap.id,
          activities: snap.data().activities,
          destination: snap.data().destination,
          startDate: snap.data().startDate,
          endDate: snap.data().endDate,
          tripDetails: snap.data().tripDetails,
          userId: snap.data().userId
        });
      });
    });
  }

Да, я на самом деле загружаю данные из службы, которая не уничтожается.

Вот фактическая служба

    getItineraries(): firebase.firestore.CollectionReference {
      return this.itineraryCollection;
    }

Коллекция создается в конструкторе службы и просто возвращает весь список пользователя.

1 Ответ

1 голос
/ 15 июня 2019

.get() возвращает Обещание и потому что Ionic кэширует страницы (если вы используете Ionics router-outlet, и я предполагаю, что вы это сделаете, потому что если вы этого не сделаете, компонент будет уничтожен после того, как вы покинете его, и будет вызван OnInitснова после того, как вы посетите его).Поэтому при повторном посещении компонента OnInit не вызывается.К счастью, Firestore дает значение onSnapshot(), которое наблюдает за изменениями в вашей коллекции:

  ngOnInit() {
    this.dataSvc.getItineraries()
    .onSnapshot( (itineraryListSnapshot: QuerySnapshot) => {
      this.matchItinerary = [];
      itineraryListSnapshot.forEach(snap => {
        this.matchItinerary.push({
          id: snap.id,
          activities: snap.data().activities,
          destination: snap.data().destination,
          startDate: snap.data().startDate,
          endDate: snap.data().endDate,
          tripDetails: snap.data().tripDetails,
          userId: snap.data().userId
        });
      });
    });

, вы также можете предоставить error обратный вызов. Подробнее читайте здесь

ps, и вы можете использовать docChanges , но, вероятно, вам не понадобится метод onSnapshot().

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...