出力が機能せず、コンソールエラーが発生しません

Question

Output()デコレータを使用しようとしていますが、何か不足している可能性があるため動作していないと思いますか？コンソールエラーはありませんので、初めて私がOutput()で作業しているので、私にとっては問題です。以下は私のコードです。

ゲーム-control.component.html

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

@Component({ 
    selector: 'app-game-control', 
    templateUrl: './game-control.component.html', 
    styleUrls: ['./game-control.component.css'] 
}) 
export class GameControlComponent implements OnInit { 

    age = 0; 
    @Output() startClicked = new EventEmitter<any>(); 

    onStartClick(){ 
    this.startClicked.emit("this has clicked "+this.age++); 
    } 

    constructor() { 
} 

    ngOnInit() { 
    } 

} 

ゲーム-control.component.html

<div class="row"> 
    <div class="col-md-12"> 

    </div> 
     <button class="btn btn-success" (click)="onStartClick()">Start</button> 
     <button class="btn btn-danger">Stop</button> 
</div> 

app.component.html

<div class="container"> 
    <div class="row"> 
    </div> 
    <div class="row"> 
    <div class="col-xs-12"> 
     <h1>{{value}}</h1> 

     <app-game-control (onStartClick)="parentFromChild($event)"> 
     </app-game-control> 
    </div> 
    </div> 
</div> 

app.component.html

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

@Component({ 
    selector: 'app-root', 
    templateUrl: './app.component.html', 
    styleUrls: ['./app.component.css'] 
}) 
export class AppComponent { 
    value = 'Ammar'; 

parentFromChild(message){ 
    this.value = message; 
} 

    constructor(){ 

    } 
} 

ページが空であり、コンソールにエラーがありません。

Answer 1

出力の名前はstartClickedなので、親から出力する必要があります。

<app-game-control (startClicked)="parentFromChild($event)"> 
    </app-game-control>