属性 使用管道时出现绑定错误

Question

我正在学习本教程

https://ultimatecourses.com/blog/angular-pipes-custom-pipes

我正在尝试让下面发布的代码正常工作。当我调用命令时

ng servr --open

我收到以下错误：

Error occurs in the template of component Appcomponent
ptoperty file does not exist on type Appcomponent

请告诉我为什么会出现此错误以及如何修复它

app.component.ts:

import { Component } from '@angular/core'
@Component({
    selector: 'app-root',
    templateUrl: './app.component.html'
})
export class AppComponent {
    file = { name: 'logo.svg', size: 2120109, type: 'image/svg' };
}

app.component.html:

{{file.name}}

{{file.size |文件大小}}

Answer 1

错误说

property file does not exist on type Appcomponent

请注意它的 AppComponent...您已声明 FileComponent

export class FileComponent {
    file = { name: 'logo.svg', size: 2120109, type: 'image/svg' };
}

只是您在 Appcomponent

中使用 FileComponent 中的 属性 file

Answer 2

你在导入时有拼写错误 从'@angulat/core'

导入{组件}

改为

从“@angular/core”导入{组件}

Answer 3

为了使用管道，我们需要在提供者中传递它

我已经创建了 stackblitz 演示，您可以查看，它在我的案例中运行良好，我附在此处，以便您查看。

如果您仍然遇到任何问题，请告诉我，这会对您有所帮助。

https://stackblitz.com/edit/angular-9bk71w?file=src%2Fapp%2Fapp.module.ts