从 PrimeNG 覆盖“MultiSelect”组件中的函数

【问题标题】：Override a function in 'MultiSelect' component from PrimeNG从 PrimeNG 覆盖“MultiSelect”组件中的函数
【发布时间】：2017-04-20 17:09:05
【问题描述】：

我是JS 的新手。我有一个小的front-end task，经过几个小时的谷歌搜索，我不知道如何解决它。

我需要在 PrimeNG MultiSelect 组件中重写此函数：MultiSelect.prototype.updateLabel。

在项目中，我正在处理的标签应该是静态的，但 alt 文本（悬停时）应该是动态的，就像最初的实现一样。

如果您指出我正确的方向，那就太好了。我找到了这个page，但它对我没有帮助，因为我不知道如何正确实现它。

提前感谢您的帮助。

【问题讨论】：

到目前为止你做了什么？

标签： javascript angular multi-select primeng

【解决方案1】：

我必须在我的项目中做同样的事情。

这是我为使其正常工作所做的工作：在组件的 .html 文件中添加如下内容：

<p-multiSelect #multiselect
        [options]="someOptions"
        [(ngModel)]="someModel.options"
        [defaultLabel]="Did this work?"
        (onChange)="onChange($event)"
>
</p-multiSelect>

在组件文件的构造函数下方，添加：

@ViewChild('multiselect') multi: MultiSelect;

我把我的放在一个总是被调用的 setter 中，但是无论你需要在哪里更改标签 - 也许在订阅函数中 - 你都可以使用以下方法覆盖：

this.multi.updateLabel = function () {
    var label = this.value.length.toString() + " Data Points Selected";
    this.valuesAsString = label;
}

希望有帮助！

【讨论】：

非常感谢！这正是我所需要的。