我想检测我是否点击了组件内部,但我有一些部分,我使用ngIf显示或隐藏一些元素,这就是问题,因为它此刻没有看到该元素,我得到了错误。任何建议如何解决这个问题?
handleClick(event){
var clickedComponent = event.target;
console.log(event.target,'adsadasdas');
var inside = false;
do {
if (clickedComponent === this._eref.nativeElement) {
inside = true;
}
clickedComponent = clickedComponent.parentNode;
} while (clickedComponent);
if(inside){
console.log('inside');
}else{
console.log('outside');
}
}
我有侧边栏组件。在侧边栏我有这个:
<default-block head="Podaci o korisniku" class="z-col-24" block="blockgroup" [(visible)]="isCustomerVisible || getFromModal" [mainBlock] = "isVisibleBackCa" [additionalItems]="true" (buttonClick)="getFromHistory()"
(openModal)="showModal($event)" [ngClass]="{disabledCa: disabled}">
<div default-block="body" class="contact-body pointer">
<div class="contact-body-wrapper" dnd-draggable [dragData]="customerGeneralInfo" (onDragStart)="dnd.set(true);" (onDragEnd)="dnd.set(false)" >
<span class="inline" *ngIf="customerGeneralInfo?.customerinfo?.lastname">
<div class="z-inputs" >
<label>Korisnik</label>
<span disabled class="textarea"> {{customerGeneralInfo?.customerinfo?.lastname}} </span>
</div>
</span>
<span class="inline" *ngIf="customerGeneralInfo?.customertypeName">
<div class="z-inputs">
<label>Tip</label>
<input class="readonly" [ngModel]="customerGeneralInfo?.customertypeName" type="text" disabled>
</div>
</span>
<span class="inline" *ngIf="customerGeneralInfo?.customerstypeName">
<div class="z-inputs">
<label>Podtip</label>
<span class="textarea">{{customerGeneralInfo?.customerstypeName}}</span>
</div>
</span>
<span class="inline" *ngIf="customerGeneralInfo?.parentName">
<div class="z-inputs">
<label>Parent</label>
<span class="textarea" disabled>{{customerGeneralInfo?.parentName}}</span>
</div>
</span>
<span class="inline" *ngIf="customerGeneralInfo?.headName">
<div class="z-inputs">
<label>Nosilac hijerarhije</label>
<span class="textarea" disabled >{{customerGeneralInfo?.headName}}</span>
</div>
</span>
<span class="inline" *ngIf="customerGeneralInfo?.activationdate">
<div class="z-inputs">
<label>Datum aktivacije korisnika</label>
<input class="readonly" [ngModel]="customerGeneralInfo?.activationdate | date:'dd.MM.yyyy'" type="text" disabled>
</div>
</span>
<span class="inline" *ngIf="customerGeneralInfo?.terminationdate">
<div class="z-inputs">
<label>Datum isključenja korisnika</label>
<input class="readonly" [ngModel]="customerGeneralInfo?.terminationdate | date:'dd.MM.yyyy'" type="text" disabled>
</div>
</span>
<span class="inline" *ngIf="customerGeneralInfo?.description">
<div class="z-inputs">
<label>Razlog isključenja korisnika</label>
<input class="readonly" [ngModel]="customerGeneralInfo?.description" type="text" disabled>
</div>
</span>
</div>
</default-block>
我有多个这个<default-block>
,其中我有可见的真或假,适用于ngIf。现在,当我点击侧边栏上的somem meni时,我将在侧边栏组件中显示该块。问题是当我在这些块之间切换时因为它们是隐藏的event.target是假的然后它总是检测到“外部”事件。