在Angular的ngFor循环中,如果一些对象被用作键,则会出现“Cannot convert object to primitive value”(无法将对象转换为原始值)的错误。
这个问题可以通过使用管道来解决。 下面是示例代码:
在组件中,您可以使用Object.keys() 方法来获取对象的key值,然后传递给ngFor循环进行遍历。
@Component({
selector: 'my-component',
template: `
- {{key}}: {{obj[key]}}
`
})
export class MyComponent {
obj = {a: 1, b: 2, c: 3};
}
@Pipe({name: 'keys'})
export class KeysPipe implements PipeTransform {
transform(value, args:string[]) : any {
if (!value) {
return value;
}
return Object.keys(value);
}
}
在模板中,将值绑定到DOM元素时,使用管道“| keys”。 管道将对象转换为其所有键的数组,并且可以循环遍历每个键。
{{key}}: {{obj[key]}}