来自本地存储的 {{array.value}} 不起作用答案

【问题标题】：{{array.value}} from localstorage not working来自本地存储的 {{array.value}} 不起作用
【发布时间】：2017-06-05 04:29:00
【问题描述】：

我目前正在使用 ionic 2 构建一个简单的电子邮件表单。所以有一个表单可以填写所有主题、消息和字体。填完表格后，我会把它作为对象放在@ionic/storage 中。您可以在下图中看到它：

现在，在下一页上，我尝试使用这些代码获取项目数据：

import { Component } from '@angular/core';
import { NavParams, NavController, LoadingController } from 'ionic-angular';

import { Storage } from '@ionic/storage';


@Component({
  selector: 'preview-email-page',
  templateUrl: 'preview-email.html',
})
export class PreviewEmailPage {
  loading: any;
  personalizeData: any[];

  constructor(
    public nav: NavController,
    public navParams: NavParams,
    public localStorage: Storage,
  ) {
    this.localStorage.get('personalizeData').then((value) => {
      this.personalizeData = value;
    })
  }

  ionViewWillEnter(){
    console.log(this.ecardData);
  }

控制台日志确实显示数据已从本地离子存储中正确获取。 console.log 输出如下：

当我想在html页面中显示值时出现问题：

<ion-header>
  <ion-navbar>
    <button ion-button menuToggle>
      <ion-icon name="menu"></ion-icon>
    </button>
    <ion-title>
      <span>Personalize {{personalizeData.subject}}</span>
    </ion-title>
  </ion-navbar>
</ion-header>

无法访问 html 页面并在控制台日志中显示以下警告：

EXCEPTION: Error in ./PreviewEmailPage class PreviewEmailPage - inline template:6:12 caused by: Cannot read property 'subject' of undefined

谁能帮我找出错误的原因？非常感谢您的帮助。谢谢你

【问题讨论】：

标签： javascript angular typescript local-storage ionic2

【解决方案1】：

那是因为在模板渲染的时候没有定义personalizeData，使用安全导航操作符（?）来避免这个错误：

<span>Personalize {{personalizeData?.subject}}</span>

阅读更多关于安全导航操作员here的信息。

【讨论】：