无法接收事件发出的值

问题描述

distance-measurment-parameters.component 是 site-map.component 中的一个子项。距离测量参数中的方法 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>

distance-measurment-parameters.component：

//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

}

解决方法

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

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

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