在primeng多选对话框关闭时触发事件答案

【问题标题】：Trigger an event on primeng multiselect dialog close在primeng多选对话框关闭时触发事件
【发布时间】：2017-06-29 20:33:32
【问题描述】：

我正在尝试使用primeng 多选组件。我想在用户关闭多选下拉菜单后立即获取所有选定的值。有没有办法做到这一点？我知道我们有 onChange() 事件，但每次用户从列表中选择或取消选择一个值时它都会触发。我想在用户选择完值后触发它。

【问题讨论】：

标签： angular primeng

【解决方案1】：

由于primeng没有提供任何api来直接实现你所需要的，这是我能够做到的一种方法。

你的.component.html

<p-multiSelect #ms [options]="cars" [(ngModel)]="selectedCars"></p-multiSelect>

你的.component.ts

import { Renderer} from '@angular/core';
import {MultiSelect} from 'primeng/primeng';

@ViewChild('ms') multiselect: MultiSelect;

constructor(private renderer  :Renderer) {}

ngOnInit(){
     this.renderer.listenGlobal('document', 'click', ()=> {
        if (!this.multiselect.selfClick && !this.multiselect.panelClick && this.multiselect.overlayVisible) {
          console.log('multiselect will hide'); // write code here to execute when multiselect overlay get dismissed/hidden
          // this.selectedCars will have all the selected values.
        }
    });
}

当用户单击多选本身以外的任何位置时，Primeng 使用相同的逻辑来关闭多选覆盖。如果将来primeng 提供实现所需结果的直接方法，您可能不需要使用此解决方法。

【讨论】：

正是我需要的。