问题描述
我曾尝试使用 eventEmitter 来处理该事件,但不知何故,该事件没有通过。
这是我尝试使用 eventEmitter 传递对象的子组件
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() { }
ngOnInit(): void {
}
onClick(){
this.isFavorite = !this.isFavorite
console.log(this.isFavorite)
this.change.emit({newValue: this.isFavorite});
}
}
这是我的子组件模板:
<p>favorite works!</p>
<button (click)=onClick()>click</button>
这是我要将事件传递到的父组件:
import { Component } from '@angular/core';
@Component({
selector: 'app-root',templateUrl: './app.component.html',styleUrls: ['./app.component.css']
})
export class AppComponent {
title = 'angular-ly';
post = {
title: "Title",isFavorite:false
}
onFavoriteChange(isFavorite:any){
console.log("Favourite change",isFavorite);
console.log(isFavorite)
}
}
这是我的父组件的模板:
<app-favorite [isFavorite]="post.isFavorite" (change)="onFavoriteChange($event)"></app-favorite>
我尝试打印从我的子组件传递到控制台的事件,这是我得到的:
true
app.component.ts:15 Favourite change undefined
app.component.ts:16 undefined
false
app.component.ts:15 Favourite change undefined
app.component.ts:16 undefined
true
app.component.ts:15 Favourite change undefined
app.component.ts:16 undefined
false
app.component.ts:15 Favourite change undefined
app.component.ts:16 undefined
解决方法
暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!
如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@)