首页 > 解决方案 > Angular 从代码中删除 @Input 装饰器

问题描述

我正在为 Angular 上的一个类编写代码,但无法理解为什么从我的组件中拉出 @Input 装饰器会导致整个应用程序无法加载。

import { Component, OnInit, Input } from '@angular/core';
import { Dish } from '../shared/dish';
import { DishService } from '../services/dish.service';

import { Params, ActivatedRoute } from '@angular/router';
import { Location } from '@angular/common';


@Component({
  selector: 'app-dishdetail',
  templateUrl: './dishdetail.component.html',
  styleUrls: ['./dishdetail.component.scss']
})
export class DishdetailComponent implements OnInit {

  @Input()
  dish: Dish;

  constructor(private dishservice: DishService,
    private route: ActivatedRoute,
    private location: Location) { }

  ngOnInit() {
    let id = +this.route.snapshot.params['id'];
    this.dish = this.dishservice.getDish(id);
  }

}

输入组件在应用程序的其他任何地方都没有使用,据我所知,它甚至与这个组件没有那么密切的关系,所以谁能解释为什么当我删除那个装饰器时,它会破坏我的程序?

标签: angulartypescriptinput

解决方案


如果您只是打开浏览器的控制台,您会看到大胖错误消息,例如

无法绑定到“dish”,因为它不是“app-dishdetail”的已知属性

此外,错误消息会告诉您尝试绑定到的确切位置dish


推荐阅读