typescript - ionic 3 typescript：按值在页面之间传递对象

Question

我正在开发 Ionic 3 应用程序，我有一个页面列出项目，如果我们单击一个项目，它会转到页面项目更新

页面项目更新包含一个更新按钮，但是当我更新了一些输入并且我没有点击更新按钮就返回时，我发现该项目已经更新

所以我认为问题在于我通过引用传递了该项目：

代码：

项目页面模板（这里的项目 = 食谱）：recipes.html

  <button ion-item *ngFor="let recipe of recipes" [navPush]="recipePage" [navParams]="recipe">
      <h2>{{recipe.title}}</h2>
      <p>{{recipe.difficulty}}</p>
  </button> 

商品详情页面组件：recipe.ts

  ionViewDidLoad(){

      this.recipe = this.navParams.data ;

  }

问题我怎样才能通过价值而不是参考的配方？

Answer 1

正如克里斯所说，您应该创建对象的深层副本。像这样的东西：

  ionViewDidLoad() {
    this.originalRecipe = this.navParams.data ;
    this.recipe =  Object.assign({}, this.originalRecipe);
  };

  update(){
    this.originalRecipe = this.recipe;
  };