离开页面

Question

因此，我将IItineraries的列表存储在我在ngOnInit上分配的私有变量中，其内容如下：

  ngOnInit() {
    this.loggedInUser = firebase.auth().currentUser;
    this.dataSvc.getItineraries().subscribe(res => {
      this.itineraries = res;
    });
    console.log('logged in user add itin page', this.itineraries);
  }

                <ion-list>
                  <div *ngFor="let itinerary of itineraries">
                    <ion-card class="itinerary-module">
                      <ion-card-content>
                        <div>
                          <h2>{{itinerary.startDate | date: "MM/dd/yyyy"}} - {{itinerary.endDate | date: "MM/dd/yyyy"}}</h2>
                        </div>
                        <div>
                          <h1>{{itinerary.destination}}</h1>
                        </div>
                        <div>
                          <h2>{{itinerary.tripDetails}}</h2>
                        </div>
                        <div class="chip" *ngFor="let activity of itinerary.activities">
                          <label> {{ activity }} </label>
                        </div>
                      </ion-card-content>
                    </ion-card>
                  </div>
                </ion-list>

在初始页面加载时就可以了...显示值，但是当我离开页面导航然后返回空白时，直到我关闭并重新打开应用程序，这些值才会显示。

Answer 1

我怀疑您的主题可观察性很冷但开始时却“没有冷却”，即未完成，并且没有发出新的值。

在您的情况下，这意味着当您导航回到页面时，您的getItineraries()服务方法new调用很可能会给您与第一次相同的Observable参考。自您第一次订阅以来，它已经开始发射。

但是，直到Observable发出新值之前，您将不会在itineraries组件属性中进行任何分配，这取决于它在内部所做的事情可能永远不会发生。

在这种情况下，您有许多可能的解决方案：尝试在组件被破坏时正确退订，将Observable修改为行为主体...

如果仅在模板中使用它，则也可以使用异步管道在此处直接调用它。组件销毁后，模板将自动退订。