子コンポーネントに複数の@outputを持つことはできますか？私は2つあり、1は

Question

動作しません。これは、子コンポーネントである：

@Component({ 
    selector: 'kg-dateSpinner', 
    templateUrl: 'kgDateSpinner.component.html', 
    styleUrls: ['kgDateSpinner.component.css'] 
}) 

export class KgDateSpinnerComponent implements OnInit { 
    @Output() onChanged = new EventEmitter<DateSpinnerReturn>(); 
    @Output() onLoadFood = new EventEmitter<DateSpinnerReturn>(); 

    sr: DateSpinnerReturn; 
    userSettings: User; 
    cd = moment(); 
    currentDate: string = this.cd.format("MMMM DD, YYYY");; 
    dateSpinnerForm: FormGroup; 

    constructor(
    private ts: ThemeService, 
    private fb: FormBuilder, 
    private ss: SettingsService) { 

    this.sr = new DateSpinnerReturn(); 
    } 


    ngOnInit() { 
    this.dateSpinnerForm = this.fb.group({ 
     currentDate: [this.currentDate, []] 
    }); 
    } 

    onLoadFoodRequest() { 
    this.sr.spinValue = this.currentDate; 
    this.onLoadFood.emit(this.sr) 
    } 

    onDateSelected(event: any) { 
    this.cd = moment(event); 
    this.returnEvent(); 
    } 

    onIncrement() { 
    this.cd = this.cd.add(1, 'day'); 
    this.returnEvent(); 
    } 

    onDecrement() { 
    this.cd = this.cd.subtract(1, 'day'); 
    this.returnEvent(); 
    } 

    returnEvent() { 
    this.currentDate = this.cd.format("MMMM DD, YYYY"); 
    this.dateSpinnerForm.controls['currentDate'].setValue(this.currentDate, { onlySelf: true }); 
    this.sr.spinValue = this.currentDate; 
    this.onChanged.emit(this.sr) 
    } 

子コンポーネントのhtml：

<form [formGroup]="dateSpinnerForm" class="ui form" novalidate> 
    <button pButton (click)="onDecrement()" icon="fa-backward"></button> 
    <div style="padding-top: 10px;width: 208px; display: inline-block;"> 
     <p-calendar formControlName="currentDate" showAnim="slideDown" (onSelect)="onDateSelected($event)" [showIcon]="true" [readonlyInput]="true" dateFormat="MM d, yy"></p-calendar> 
    </div> 

    <button pButton (click)="onIncrement()" icon="fa-forward"></button> 
    <button pButton (click)="onLoadFoodRequest()" icon="fa-cutlery" iconPos="left"></button> 
</form> 

親コンポーネント：

onChanged(sr: DateSpinnerReturn) { 
    this.diaryDate = sr.spinValue; 
} 

onLoadFood(sr: DateSpinnerReturn) { 
    this.diaryDate = sr.spinValue; 
} 

親HTML：

<header> 
    <kg-dateSpinner></kg-dateSpinner> 
</header> 

onChangedイベントは、子からデータを受け取りますが、onLoadFoodはデータを受け取りません。 子コンポーネントのボタンを押すと、LoadFoodRequest関数が起動され、エラーは発生しません。何か案は？あなたは、あなたの子コンポーネントへのあなたの親をバインドこれにあなたの親のhtmlを変更する必要が

Answer 1

：

<header> 
    <kg-dateSpinner (onChanged)="onChanged($event)" (onLoadFood)="onLoadFood($event)"></kg-dateSpinner> 
</header> 

だから、括弧内は引用符の内側に、あなたの子供の出力名は、あなたの親関数は