代码之家 › 专栏 › 技术社区 › Karim Garali

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

return-by-value pass-by-value pass-by-reference ionic-framework typescript

0

Karim Garali · 技术社区 · 6 年前

我正在开发一个Ionic 3应用程序,我有一个页面,其中列出了项目,如果我们单击某个项目,它将转到页面项目更新

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

所以我认为问题在于我是通过引用传递项目的:

代码:

项目页面模板(此处项目=配方):配方。html

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

项目详细信息页面组件:配方。ts

  ionViewDidLoad(){

      this.recipe = this.navParams.data ;

  }

问题:我如何才能传递有价值的配方而不是参考配方?

1 回复 | 直到 6 年前

1

0

Dawit abate 6 年前

正如克里斯所说,您应该创建对象的深度副本。类似这样:

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

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