我有一个带有单个 @Input 元素的 Angular 组件：
@Input('member') member: Member;
该Member界面看起来是这样的：
export interface Member {
name: string;
surname: string;
display_name: string;
positions: number[];
image_url: string;
email: string;
address: string;
office_phone: string;
phone: string;
whatsapp: string;
skype: string;
}
我想从 html 模板中访问成员字段，例如{{ name }}，{{ email }}等等......没有为每个字段添加前缀。
举例来说，我不希望访问这些属性一样{{ member.name }}，{{ member.email }}我喜欢的快捷版本。
该组件将只有一个 @Inpurt 属性 - Member 对象。
有没有一种很好的方法来重新分配成员。Angular 组件的属性？或者我上面提到的任何其他使用快捷方式的方法？
不是一个好习惯，但您应该将该对象传播到您的组件中：
ngOnInit() {
Object.entries(this.member).forEach(([key, value]) => this[key] = value);
// OR
Object.assign(this, this.member);
}
您现在可以像使用类属性一样使用它们。请注意，它会覆盖您的类上具有相同名称的任何其他属性，因此您应该小心该解决方案并使用member.XXX.
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句