时间戳

首页 > 解决方案 > 无法接收事件发出的值

javascript - 无法接收事件发出的值

问题描述

distance-measurment-parameters.component 是 site-map.component 中的一个子项。distance-measurment-parameters 中的 hideWindowOverlay() 方法在窗口关闭并发出如下所示的事件时被调用。显示 hideWindowOverlay() 中的日志语句，表示事件已发出。

在组件site-map.component中，我监听或订阅事件'evtEmitterOnDistanceMeasurementWindowClosed'，如下所示，如下面的代码所示

(evtEmitterOnDistanceMeasurementWindowClosed)=onDistanceMeasurementWindowClosedEvtReceived($event)/>

问题是，永远不会调用方法 onDistanceMeasurementWindowClosedEvtReceived()，因此不会收到事件。

请让我知道如何正确订阅事件“evtEmitterOnDistanceMeasurementWindowClosed”以及如何调用“onDistanceMeasurementWindowClosedEvtReceived”方法

在 site-map.html 中：

<clr-toggle-wrapper *ngIf="showMeasureDistance">
<input type="checkbox" clrCheckbox  (change)="toggleDistanceMeasurementOverlay()"  [(checked)]="showMeasureDistanceOverlay"
(evtEmitterOnDistanceMeasurementWindowClosed)=onDistanceMeasurementWindowClosedEvtReceived($event)/>
<label >
    {{ "SITE.MEASURE_DISTANCE" | translate }} 
    <button class="btn btn-sm btn-icon" (click)="showInformation('SERVICE_MEASURE_DISTANCE')">
        <clr-icon shape="help-info" class="is-solid"></clr-icon>
    </button>

</label>
</clr-toggle-wrapper>

距离测量参数。组件：

//declaration of the event emitter
@Output("evtEmitterOnDistanceMeasurementWindowClosed")
evtEmitterOnDistanceMeasurementWindowClosed: EventEmitter<boolean> = new 
EventEmitter<boolean>();

hideWindowOverlay() {
//throw new Error('Method not implemented.');
this.showWindow = false;
this.evtEmitterOnDistanceMeasurementWindowClosed.emit(true);
console.log("hideWindowOverlay: emits event this.evtEmitterOnDistanceMeasurementWindowClosed.emit(true)");//log here are displayed
}

在 site-map.component：

onDistanceMeasurementWindowClosedEvtReceived(event: boolean){
    this.toggleDistanceMeasurementOverlay();  
    console.log("onDistanceMeasurementWindowClosedEvtReceived: ");//log are not displayed

}

标签： javascriptangulartypescriptangular-event-emitter

解决方案

正如我所看到的，您正在尝试从输入元素收听 evtEmitterOnDistanceMeasurementWindowClosed 事件，但输入没有这样的事件发射器。尝试在某些内置输入事件上调用 onDistanceMeasurementWindowClosedEvtReceived 方法 - onchange 例如

或者像这样使用 [(ngModel)]

<input [(ngModel)]="value"
        (ngModelChange)="onDistanceMeasurementWindowClosedEvtReceived($event)"
      />

推荐阅读