Angular рассматривает экземпляры определенного класса как Object

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 являются классами, которые используются в приложении. Я ожидаю, что функция editRecipe приводит к подстановке в намеченном index.however после подстановки getRecipe для вставленного элемента не удается. дополнительные исследования показали, что, поскольку вставленный элемент рассматривается как объект, а не как Рецепт, хотя я произвел явное приведение, он не может его найти. А что я могу сделать? Спасибо вам, ребята.

Answer 1

Это было на самом деле из-за ошибки, связанной с обработкой форм. Я должен был убедиться, что поля FormGroup были одинаковыми полями моего компонента класса. В то время как я допустил ошибку, и именно поэтому аргумент не может быть выведен как Рецепт Спасибо вы все ребята.

Answer 2

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);

Пример живого плунжера