错误TypeError:_co.onBlueprintAdded不是函数

TOL*_*ULA 2 angular

cockpit.component.ts......... ....... ......... ....... ......... ....... ........ ....... .. ..... ...... ....... ....

import {Component, EventEmitter, OnInit, Output} from '@angular/core';

@Component({
  selector: 'app-cockpit',
  templateUrl: './cockpit.component.html',
  styleUrls: ['./cockpit.component.css']
})
export class CockpitComponent implements OnInit {
  @Output() serverCreated = new EventEmitter<{serverName: string, serverContent: string}>();
  @Output() blueprintCreated = new EventEmitter<{serverName: string, serverContent: string}>();
  newServerName = '';
  newServerContent = '';
  constructor() { }

  ngOnInit() {
  }
  onAddServer() {
    this.serverCreated.emit(
      {serverName: this.newServerName,
        serverContent: this.newServerContent
      });
  }

  onAddBlueprint() {
    this.blueprintCreated.emit(
      {serverName: this.newServerName,
        serverContent: this.newServerContent
      });
  }
}
Run Code Online (Sandbox Code Playgroud)

谁能解释为什么我会收到以下错误?我是棱角分明的初学者.

app.component.ts

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

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  serverElements = [{
    type: 'server',
    name: 'Testserver',
    content: 'Just a Test!!'
  }];


  onServerAdded(serverData: {serverName: string, serverContent: string}) {
    this.serverElements.push({
      type: 'server',
      name: serverData.serverName,
      content: serverData.serverContent
    });
  }

  onBlueprintAdded(blueprintData: {serverName: string, serverContent: string}) {
    this.serverElements.push({
      type: 'blueprint',
      name: blueprintData.serverName,
      content: blueprintData.serverContent
    });
  }
}
Run Code Online (Sandbox Code Playgroud)
<div class="container">
  <app-cockpit
    (serverCreated)="onServerAdded($event)"
    (blueprintCreated)="onBlueprintAdded($event)"
  ></app-cockpit>
  <hr>
  <div class="row">
    <div class="col-xs-12">
     <app-server-element
       *ngFor="let serverElement of serverElements"
       [element]="serverElement"
     ></app-server-element>
    </div>
  </div>
</div>
Run Code Online (Sandbox Code Playgroud)

控制台出错:

AppComponent.html:2 ERROR TypeError: _co.onBlueprintAdded is not a function
    at Object.eval [as handleEvent] (AppComponent.html:4)
    at handleEvent (core.es5.js:12023)
    at callWithDebugContext (core.es5.js:13493)
    at Object.debugHandleEvent [as handleEvent] (core.es5.js:13081)
    at dispatchEvent (core.es5.js:8615)
    at core.es5.js:10783
    at SafeSubscriber.schedulerFn [as _next] (core.es5.js:3647)
    at SafeSubscriber.__tryOrUnsub (Subscriber.js:238)
    at SafeSubscriber.next (Subscriber.js:185)
    at Subscriber._next (Subscriber.js:125)
Run Code Online (Sandbox Code Playgroud)

在我发布问题之前,我仍然需要写一些东西

小智 10

再次重新运行ng服务,它将成为新的Bundle