Ionic 3 和 Angular 2 中的多个 @Input答案

【问题标题】：Multiple @Input in Ionic 3 and Angular 2Ionic 3 和 Angular 2 中的多个 @Input
【发布时间】：2018-04-12 03:59:46
【问题描述】：

在我的 Ionic 3 项目中，我创建了自定义组件 my-component。现在我们知道使用 angular @Input 我们可以将数据传递给这个组件。我有 2 个输入作为

  @Input('finder') myFinder: Finder; //Finder is an Interface
  @Input('list') myList: Array<any>;

我将这个组件用作

<my-component [finder]="dataFinder" [list]="aList"></my-component>

dataFinder 和 aList 都有值，但 myFinder 值始终为 undefined，其中 myList 已正确填充。

这是使用多个输入的任何限制吗？

【问题讨论】：

【解决方案1】：

实际上，您根本不需要维护 2 个数据绑定属性。您可以更优雅地执行此操作，如下所示。希望代码是不言自明的。

my-class.ts

export class MyClass{
   finder:Finder;
   myList:Array<any>;   
}

.ts

@Input('data') data: MyClass;

.html

<my-component [data]="data"></my-component>

【讨论】：