错误提示是因为在AppComponent上不存在名为'book'的属性。正确的属性名应该是'books'。 解决方法是将模板中的'book'替换为'books'。
下面是一个示例代码,展示了如何修复此错误:
component.ts文件:
import { Component } from '@angular/core';
@Component({
selector: 'app-root',
template: `
Books:
-
{{ book.title }}
`
})
export class AppComponent {
books = [
{ title: 'Book 1' },
{ title: 'Book 2' },
{ title: 'Book 3' }
];
}
在上面的代码中,我们修改了模板中的*ngFor循环,将'book'替换为'books'。这样,*ngFor指令就会遍历AppComponent中的'books'属性,显示每本书的标题。
修复后的模板显示了一个标题为"Books"的h1标签,下面是一个无序列表,列表中包含了AppComponent中的每本书的标题。
通过将'book'替换为'books',我们解决了Angular ngFor错误TS2551的问题。