使用@Input（）时出现TypeScript错误

Question

我正在尝试使用Angular 4开发应用程序。但是使用时我收到了一条错误消息

@Input('inputProducts') products: Product[];

错误是

[tslint]在“ ProductListComponent”类中，不应将指令输入属性“ products”重命名。请考虑以下使用“ @Input（）产品：字符串”（no-input-rename）。

该错误没有任何效果，我的应用程序运行正常，但令人讨厌，无法将其删除。代码段如下：

import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
import { Product } from '../product-row/product.model';
@Component({
  selector: 'app-product-list',
  templateUrl: './product-list.component.html',
  styleUrls: ['./product-list.component.css']
})
export class ProductListComponent implements OnInit {
  @Input('inputProducts') products: Product[];
  @Output() selectedProduct: EventEmitter<Product>;
  constructor() {
    this.selectedProduct = new EventEmitter();
  }
  clickedProduct(p: Product): boolean {
    this.selectedProduct.emit(p);
    return false;
  }
  ngOnInit() {
  }
}

html部分

<app-product-list [inputProducts]="products"></app-product-list>

请指出正确的方向，以消除此错误。

Answer 1

@Input() inputProducts: Product[]; 应该可以解决您的问题。

Answer 2

这是样式指南，no-input-rename您应该将规则设置为 false 以免出现此类 tslint 错误。通常在您使用 Angular CLI 生成项目时no-input-rename设置为true。转到您的 tslint 文件并使其值等于false. 应该看起来像："no-input-rename": false。