Question

在子元素中单击模糊时，如何使用模糊而不激活模糊？我无法在li元素上触发click事件。

<div class="select-menu">
  <div class="selected" tabindex="0" (blur)="showList = false" (click)="showList = !showList"><span>{{selected}}</span></div>
  <ng-container *ngIf="showList">
    <ul>
      <li *ngFor="let item of list; let i=index" (click)="selectItem(item, i)">
        <span>{{item}}</span>
      </li>
    </ul>
  </ng-container>
</div>

Answer 1

如果您希望“外部单击框必须关闭该框”（如弹出窗口），则可以在click上注册document侦听器，并确定该单击是否在框区域之外：

export class BoxComponent {

    openedBox = false;

    @ViewChild('box', { read: ElementRef }) boxRef: ElementRef;

    @HostListener('document:click', ['$event'])
    clickOutsideCurrentPopup(event: Event) {
        if (this.openedBox) {
            // if clicked outside only
            if (!this.boxRef.nativeElement.contains(event.target)) {
                this.openedBox = false; // or do whatever you want to close your box
            }
        }
        // else is already closed, do nothing
    }
}

除了在子元素中单击时，如何在角度中（模糊）元素

1 个答案: