使用 Angular 9 将参数传递到构造函数会生成 ng2003 错误

Question

Angular 和一般编程的新手。我想知道为什么这个简单的代码在 Angular 9 中不起作用。

import { Component, OnInit } from '@angular/core';

@Component({
  selector: 'app-record-list',
  templateUrl: './record-list.component.html',
  styleUrls: ['./record-list.component.css'],
})
export class RecordListComponent implements OnInit {
  records;
  recordsFiltered;
  searchTerm: string;


  ngOnInit(): void {
    console.log('OnInit records: ', this.records);
  }

  constructor(title) {
    this.records = title;
  }
}

let model1 = new RecordListComponent('Idea 1 title');

相反，我在终端中收到此错误：

src/app/record-list/record-list 中的错误。component.ts:37:15 - 错误 NG2003：class 'RecordListComponent' 的参数 'title' 没有合适的注入令牌。没有类型或装饰器

Answer 1

两条评论都是正确的。所以最好的方法是通过@Input装饰器设置数据（标题）：

import { Component } from '@angular/core';

@Component({
    selector: 'app-record-list',
    templateUrl: './record-list.component.html',
    styleUrls: ['./record-list.component.css'],
})
export class RecordListComponent {

    records;
    recordsFiltered;
    searchTerm: string;
    @Input() title: string;

}

在 parent 组件的模板中：

<app-record-list [title]="'your title'"></app-record-list>

见angular doc: input decorator

使用 Angular 9 将参数传递到构造函数会生成 ng2003 错误

Passing a parameter into constructor generates an ng2003 error using Angular 9

constructor

angular

angular9