[英]can i bind from event to custom component output
i am having a custom component我有一个自定义组件
export class SystemInputComponent implements OnInit, OnDestroy {
@Input() ...
@Output() enterFn: EventEmitter<any> = new EventEmitter<any>();
...
that has output that act as an event as i know据我所知,它具有作为事件的输出
and that component imported outside in other component html并且该组件在其他组件 html 中导入外部
<div class="input-group">
<system-input #systemInput></system-input>
</div>
the regular way to bind the event is add it into the component tag as attribute with () and bind it to a function绑定事件的常规方法是将它作为属性添加到组件标记中 () 并将其绑定到函数
<system-input #systemInput (enterFn)="someFunct($event)"></system-input>
the question is can i bind it from ts code with rxjs fromEvent function like this问题是我可以像这样使用 rxjs fromEvent 函数从 ts 代码绑定它吗
inside .ts file .ts 文件内
import { fromEvent } from 'rxjs';
.
.
..
@ViewChild('systemInput') systemInput:any;
ngOnInit(){
fromEvent(this.systemInput.nativeElement,'enterFn').subscribe(a => //a is the $event );
}
..
and if it could how to it properly, because it give me a error如果它可以如何正确,因为它给了我一个错误
Cannot read property 'nativeElement' of undefined
EDIT as JoH said in the first comment i moved it to ngAfterViewInit正如 JoH 在第一条评论中所说的那样编辑,我将其移至 ngAfterViewInit
ngAfterViewInit(){
fromEvent(this.systemInput.elementRef.nativeElement,'enterFn').subscribe(a => //a is the $event );
}
it give me that new error它给了我新的错误
Invalid Event Traget
nativeElement
usually used to get a reference to the HTML element class. nativeElement
通常用于获取对 HTML 元素类的引用。 While here you ViewChild
of an Angular component.在这里,您是 Angular 组件的ViewChild
。 It doesn't have nativeElement
property.它没有nativeElement
属性。
So to subscribe directly you don't need fromEvent
:所以直接订阅你不需要fromEvent
:
@ViewChild('systemInput') systemInput: SystemInputComponent;
ngAfterViewInit(){
this.systemInput.enterFn.subscribe(a => //a is the $event );
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.