Question

我在角度4中有以下服务：

import { Injectable, EventEmitter } from '@angular/core';
import {Recipe} from './recipe'
import {Ingredient} from '../shared/ingredient'
@Injectable()
export class RecipeService {

  private recipes:Recipe[]=[new Recipe("Dummy","Dummy","http://media.wiley.com/product_data/coverImage300/2X/04707687/047076872X.jpg",[new Ingredient("French Food",5),new Ingredient("Dummy Book",1)]),
                   new Recipe("jahangiri","a perfect vice president","http://biographyha.com/wp-content/uploads/2014/12/Eshaq-Jahangiri-biographya-com-2.jpg",[new Ingredient("French Food",5),new Ingredient("Dummy Book",1)]) ]

  //do some functionalities

  getRecipe(id:number)
  {
    return this.recipes[id];
  }
  editRecipe(oldRecipe:Recipe,newRecipe:Recipe)
  {
    this.recipes[this.recipes.indexOf(oldRecipe)]=newRecipe as Recipe;
    console.log(newRecipe as Recipe)
  }

  //do other functionalities
}

其中 Recipe 和 Ingredient 是app中使用的类。我希望 editRecipe 函数导致在预期的index中替换。但在替换 getRecipe 之后插入的项失败。更多的检查显示，由于插入的项目被视为对象，而不是 Recipe ，虽然我已经完成了显式转换，但却无法找到。我能做什么？谢谢你们。

Answer 1

as Recipe不会设置原型，它只是一个打印到JavaScript时被删除的打字稿注释。它仅用于类型检查。

您可以在配方构造函数中使用部分对象（或类型本身，如果您想要使所有属性都需要），如下所示：

constructor(partial: Partial<Recipe>) {
  if (partial) {
    this.name = partial.name
    this.url = partial.url
  }
}

然后在你的编辑食谱中使用

this.recipes[this.recipes.indexOf(oldRecipe)] = new Recipe(newRecipe);

Live plunker example

Answer 2

实际上是由于处理表单处理时出错。我必须确保FormGroup的字段与我的类成分的字段相同。虽然我在那里犯了一个错误，这是为什么这个论点不能推断为 Recipe 谢谢大家。

Angular将特定类的实例视为Object

2 个答案: