Question

我在Ionic 3中获得了3级深度导航视图。

在第一个视图中，我从本地存储中获取数据并输出一个列表

第1页

getPrograms() {
   this.storage.get("fetchedData").then(val => {
   if (val.hasOwnProperty("programs")) {
     this.programs = val.programs;

     for (var i = 0; i < this.programs.length; i++) {
      if (this.programs[i].exercises.length) {
        this.exercises.push(this.programs[i].exercises);
      }
    }
   }
  });   
 }

itemTapped(event, program) {
  this.navCtrl.push(Exercises, {
  programs: program
});   }

然后在第二个视图中我从第一个视图中获取带有参数的数据并生成另一个列表（来自参数数据）

第2页

 this.currentProgram = this.navParams.get("programs"); 

 getExercises() {
  if (this.currentProgram.hasOwnProperty("exercises")) {
  this.exercises = this.currentProgram.exercises;    
}

seeDetails(event, exercise) {
  this.navCtrl.push(ExerciseDetails, {
    exercises: exercise
   });  
}

在第三个视图中，我使用params

从第二个视图中获取数据

第3页

this.item = navParams.get("exercises");

然后当用户提交一些时更改并将它们发布到外部API我做了更改存储价值

   getUpdatedData() {
   this.storage.remove("fetchedData").then(() => { 
     //make request to API for refreshed data from endpoint
     this.programsService.getPrograms(userhash).subscribe(res => {
       if (res != null && res != undefined) {
             this.storage.set("fetchedData", res).then(() => {
                 this.loader.dismiss();
                 this.navCtrl.pop();
             });
       }
     });
   });   
  }

因此，当我使用getUpdatedData（）从3级视图中弹出时，第二级数据中没有更新（存储已更改，因此应以某种方式反映在第一个视图中，然后传递给第二个视图）

Answer 1

我相信您的代码正常运行。问题是：您将数据添加到存储（可能是sqllite），但在第二页中您不检查该数据。我的建议是使用事件。

在你的第3页上，你应该在弹出导航控制器

后立即执行

this.events.publish('data:updated');

然后在你的page2的构造函数中，使用

订阅该事件

this.events.subscribe('data:updated', () => {
  this.updateData();
})

updateData(){
  //now get your saved data here and use it to update your fields
}

Answer 2

尝试使用async，它需要一个observable，它会获取最新的更新值。

https://angular.io/api/common/AsyncPipe

这对我有用。

第3级视图中的离子导航弹出不会更新第2级页面（更改数据）

2 个答案: