插值在第一次加载页面时不起作用答案

【问题标题】：Interpolation doesn't work on first load of the page插值在第一次加载页面时不起作用
【发布时间】：2017-04-19 03:05:43
【问题描述】：

在用户输入他的名字并单击登录的登录后，下一页不会显示该名称。如果他返回并重试，那么它在那时和之后都会起作用。

在 HTML 模板上：

<ion-title>Your name is {{name}}</ion-title>

在组件上：

  name: string;
  constructor(public navCtrl: NavController, public navParams: NavParams, private storage: Storage) {
    this.storage.get('name').then((val) => {this.name= val;});
  }

【问题讨论】：

什么时候存储在this.storage中？你能添加那部分吗？
在上一个登录页面。我的意思是一切正常，除了第一次加载网站。

标签： angular promise ionic2 interpolation

【解决方案1】：

我认为您正在将下一页推到 storage.set() 部分之外。因为，我无权访问您的代码，演示它应该如何完成。我相信这会奏效：

this.storage.set('name',"somename")
 .then((val) => {
   console.log("Value is set to somename");
   this.navCtrl.push(NextPage);
 });

这将在您设置存储值的上一页上完成。

在这种情况下，确保只有在设置了值后才能导航到下一页。

【讨论】：

【解决方案2】：

当用户登录时，您可以在您的组件中公开一个事件（离子事件），只需订阅您定义的事件。每当事件触发时，您都可以更新您的属性。

您的应用程序无法运行，因为在早期状态下，存储不会保留任何数据，即使您从存储中获取，也没什么。

constructor(
    private events: Events,
    private storage: Storage,
    //...
) { } 

login(/* params */) {
  // after login successful, save name to storage
  this.storage.set('name', JSON.stringify(name))
    .subscribe(() => {
      this.events.publish('login:success');
    });
}

在组件上：

name: string;
constructor(public navCtrl: NavController, public navParams: NavParams, private storage: Storage, private events: Events) {
    this.storage.get('name').then((val) => {this.name= val;});
    this.event.subscribe('login:success', () => {
      this.storage.get('name').then((val) => {this.name= val;});
    })
  }
}

【讨论】：