大佬教程收集整理的这篇文章主要介绍了Angular 2 ng-content从子组件接收事件,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
问题是我想从孩子向小组发送一个事件,但我似乎无法找到答案.这是我到目前为止所拥有的:
// Panel Panel Component @Component({ SELEctor: 'panel',template: ` <div (emittedEvent)="func($event)"> <ng-content></ng-content> </div> ` }) export class PanelComponent { constructor() {} func(event) { // Do stuff with the event } } // Child Panel Component (one of many) @Component({ SELEctor: 'child-panel-one',template: ` // Template stuff <button (click)="emitEvent()">Click</button> ` }) export class ChildPanelOne { emittedValue: Boolean = false; @Output() emittedEvent = new EventEmitter(); constructor() {} private emitEvent() { this.emittedValue = true; this.emittedEvent.emit(this.emittedvalue) } } // // Main Parent Template <panel> <child-panel-one></child-panel-one> </panel>
我可以创建一个共享服务,但是将布尔值从子节点传递给父节点似乎太过分了.
有任何想法吗?
谢谢
<panel #p> <child-panel-one (emittedEvent)="p.func($event)"></child-panel-one> </panel>
但是这需要< panel>的用户设置事件绑定
或者你可以像in Angular2 how to know when ANY form input field lost focus中所示的DOM事件
或者您可以使用’@ ContentChildren()`然后命令性地订阅
@ContentChildren(ChildPanelOnE) childPanels:QueryList<ChildPanelOne>
ngAfterContenTinit() { this.childPanels.toArray().forEach(cp => cp.emittedValue.subscribe(() => ...)); }
但这要求所有子面板都是预定义类型.
您还可以使用具有可观察的共享服务,子组件注入并用于向父组件发出事件.
以上是大佬教程为你收集整理的Angular 2 ng-content从子组件接收事件全部内容,希望文章能够帮你解决Angular 2 ng-content从子组件接收事件所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。