在@Output事件角6中获取事件对象代替值

Question

你能帮我解决这个问题吗？在从子对象发送输出事件并侦听其父事件时，我将获取事件对象而不是值。

这是我的密码

app.component.ts

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

  @Component({
      selector: 'app-root',
      templateUrl: './app.component.html',
      styleUrls: ['./app.component.css']
  })
  export class AppComponent {
    title = 'Hello Umashankar';
     /**
   * We can pass this dat to child component using Input 
    */
   post={
       title:"Angular Practice",
       isFavorite:false
    }
   onisFavoriteChange(isFavorite){
    console.log(isFavorite)
   }
  }

app.component.html

     <h1>Courses Application</h1>

     <app-favorite [isFavorite]="post.isFavorite" (click)="onisFavoriteChange($event,value)"></app-favorite>

favorite.component.ts

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

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

   @Input('isFavorite') isFavorite:boolean;

   @Output() change = new EventEmitter();

   constructor() { }


   setResetFavorite(){
     this.isFavorite =!this.isFavorite;
     this.change.emit(this.isFavorite);
   }

 }

Answer 1

将输出装饰器名称用作事件名称“

输出修饰器名称应与输出属性绑定匹配。

 @Output() data = new EventEmitter();

<app-favorite [isFavorite]="post.isFavorite" (data)="onisFavoriteChange($event)"></app-favorite>

  <app-favorite [isFavorite]="post.isFavorite" (change)="onisFavoriteChange($event)"></app-favorite>

TS

onisFavoriteChange(e){
    console.log(e)
   }

示例：https://stackblitz.com/edit/angular-yuvgdt

Answer 2

将click替换为change at app.component.html，如下所示

(click)="onisFavoriteChange($event,value)

使用

(change)="onisFavoriteChange($event,value)"