TypeError: _co.function is not a function

TypeError: _co.function is not a function

我正在使用 angular 并尝试在我的本地主机上制作网页,但我无法使用函数。我认为这是一个路径问题,但我已经正确声明了所有路径。

花了 4 个小时试图 google 回答,没有找到任何可以回答这个问题的东西。

我自己创建了 2 个组件,在我创建 angular 项目时默认创建的组件之外:

post-create.component.html

post-create.component.ts

在应用程序文件夹中,它们都位于:

'./posts/posts-create/post-create.component.html'
'./posts/posts-create/post-create.component.ts'

我复制粘贴了文件夹的名称以确保它不是拼写错误

post-create.component.ts 看起来像这样:

import { Component } from '@angular/core';


@Component({
  selector: 'app-post-create',
  templateUrl: './post-create.component.html'
})
export class PostCreateComponent{
  newPost = '';

  onAddPost(){
    this.newPost = 'The users posts';
  }
}

post-create.component.html 只是随机填充了一些东西来让它工作,但看起来像这样:

<h2> sup </h2>

我的app.component.html是:

<h1> Hello world </h1>
<textarea rows="6"></textarea>
<hr>
<button (click)="onAddPost()"> Save post </button>
<p>{{ newPost }}</p>

这应该在单击按钮时调用函数 "onAddPost()" 但实际上没有。它给出了这个错误: 错误类型错误:_co.onAddPost 不是函数

我不知道为什么。我的 app.module.ts 文件是这样的:

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { PostCreateComponent } from './posts/posts-create/post-create.component'

@NgModule({
  declarations: [
    AppComponent,
    PostCreateComponent
  ],
  imports: [
    BrowserModule,
    AppRoutingModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

如你所见,我导入了 import { PostCreateComponent } from './posts/posts-create/post-create.component' 并将其添加到 decleraction

该代码是我正在观看的视频的一部分,只是为了进入其中而编写代码。如果你受伤,它来自这个视频: https://www.youtube.com/watch?v=1tRLveSyNz8&fbclid=IwAR0k3FKxqbYVKuT3g2UgJVQWFW2xFXV8xmhzGbwqbyZ3ltWrBcVktYc38_I

提前感谢您的回答,很抱歉占用您的时间,我已经尝试自己解决这个问题,但似乎无法找出为什么它不让我使用该功能

在 1:02:00 再次观看 video :

以下内容与post-create.component.ts相关(与app.component.ts无关):

<h1> Hello world </h1>
<textarea rows="6"></textarea>
<hr>
<button (click)="onAddPost()"> Save post </button>
<p>{{ newPost }}</p>