从 PrimeNG 覆盖 'MultiSelect' 组件中的函数

Question

我是 JS 的新人。我有一个小问题 front-end task，谷歌搜索了几个小时后我不知道如何解决它。

我需要在 PrimeNG MultiSelect 组件中覆盖此功能：MultiSelect.prototype.updateLabel。

在项目中，我的工作是标签应该是静态的，但替代文本（悬停时）应该是动态的，就像最初实现的那样。

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

在此先感谢您的帮助。

Answer 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;
}

希望对您有所帮助！

从 PrimeNG 覆盖 'MultiSelect' 组件中的函数

Override a function in 'MultiSelect' component from PrimeNG

javascript

angular

multi-select

primeng