[英]Angular 5 EventEmitter Not working well
我试图在子组件上调用父组件功能,并像这样实现。
项目form.component.ts
@Component({
selector: 'app-project-form',
templateUrl: './project-form.component.html',
styleUrls: ['./project-form.component.css'],
encapsulation: ViewEncapsulation.None
})
export class ProjectFormComponent implements OnInit {
@Input() project: Project;
@Output() createProject = new EventEmitter<string>();
newProject() {
console.log("submit");
this.createProject.emit('submit');
}
}
项目form.component.html
<button (click)="newProject()" class = "btn-success" >New</button>
项目view.component.ts
export class ProjectViewComponent implements OnInit {
projects: Project[];
projectform: Project;
createProject(event){
console.log("create Project on parent component");
}
}
项目view.component.html
<app-project-form [project]="projectform" (createProject)="createProject($event)"></app-project-form>
这里当我点击子组件的New
按钮时,我只能在控制台上看到"submit"
而不是"create Project on parent component"
。
这意味着不发出事件或父母未收到事件。 基本上,我错过了一些东西。
请为我分享任何类型的打击。
你错过了一件事@artgb, createProject(event:string){}
你试试这个。
实际上我尝试了你的代码,它在Angular 5.0.0上工作正常。 当我点击New('submit'和'create Project ...')时,我收到两条控制台消息。 我认为你的问题可能与EventEmitter没有直接关系。 您提供的代码片段直接编译并运行以下amendements(如果您要测试它):
添加缺少的导入
添加ngOnInit
所以我发现你当前的代码没有任何问题。 您的问题可能在其他地方。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.