[英]How can i pass an Object from my Parent template to the Child Component
i have a interface which looks like this我有一个看起来像这样的界面
export interface IDropdownOption {
guid: string;
width: string;
isRequired: false;
fieldText: string;
selectedItem: string;
}
In my Child component i define an Input like this @Input() compInfo: IDropdownOption;在我的子组件中,我定义了一个像这样的输入@Input() compInfo: IDropdownOption; and then in my Parent template i use the client like this
然后在我的父模板中我使用这样的客户端
<app-ig-dropdown
compInfo.guid="820E04E0-8084-4D9C-A268-D8C0D21E74F6"
compInfo.width="200px"
formControlName="combo1"
compInfo.fieldText="Social Media">
</app-ig-dropdown>
Doing so will always generate me errors that the property of any of these values defined in object compInfo are undefined.这样做总是会产生错误,即 object compInfo 中定义的任何这些值的属性未定义。 Is it even possible to use an Object as the @input and then set the values from the parent template?
甚至可以使用 Object 作为@input,然后从父模板设置值吗? I am trying to avoid declaring 50 + inputs as i might have 10 child components on the parent which each has 5 param.
我试图避免声明 50 + 输入,因为我可能在父组件上有 10 个子组件,每个子组件有 5 个参数。 If this is not supported how else can i make this more clean?
如果这不受支持,我还能如何让它更干净?
Ultimately i was able to solve the issue by assigning the values in my parent template like this.最终,我能够通过像这样在我的父模板中分配值来解决这个问题。
<app-ig-dropdown
[compInfo]="{guid :'820E04E0-8084-4D9C-A268-D8C0D21E74F6',
width:'350px',
placeHolder: ' -- Select --',
fieldText:'Social Media 1'}"
formControlName="combo1"
>
</app-ig-dropdown>
<app-ig-dropdown
[compInfo]="{guid :'820E04E0-8084-4D9C-A268-D8C0D21E74F6',
width:'350px',
placeHolder: ' -- Select --',
fieldText:'Social Media 2'}"
formControlName="combo2"
>
</app-ig-dropdown>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.