Angular 2 多选仅显示静态占位符答案

【问题标题】：Angular 2 multi select show only the static placeholderAngular 2 多选仅显示静态占位符
【发布时间】：2018-11-10 19:19:03
【问题描述】：

我是 Angular 4 的新手，我开始使用 Angular 多选并使用以下 npm 包

我可以正确配置它，并且还可以获取选中和取消选中的项目/事件。

现在我的问题是仅显示占位符文本，即使是否有选定的项目。我想忽略要显示在顶部的选定项目。

如果从项目中选择了任何项目，则多选框将转换如下

但如果有选定的项目，我想保持占位符不变，如下所示。

我一直在尝试通过响应式行为来摆脱它。但无法找到解决方案。请帮帮我。

【问题讨论】：

请分享一个复制此问题的最小 Stackblitz 示例。
我没有使用此组件的经验，但您似乎可以自定义所选项目在文本框中的显示方式：<angular2-multiselect ...> <c-badge> <ng-template let-item="item"> <label style="margin: 0px;">{{item.itemName}}</label> ... </ng-template> </c-badge> </angular2-multiselect> （参见npmjs.com/package/…）也许您可以尝试使用空模板？
也许你可以尝试在开发者的 Github 页面上提问。 github.com/CuppaLabs/angular2-multiselect-dropdown/issues

【解决方案1】：

目前，该功能似乎不存在。但是，有一种解决方法。

解决方法

您可以隐藏显示的列表。在您的 CSS 中，您可以添加以下内容：

.c-list{
   display: none;
}

这不会显示“选择国家”占位符，但会部分实现您想要做的事情。

【讨论】：

【解决方案2】：

解决方法

使用 CSS 隐藏列表

angular2-multiselect /deep/ .c-list {
  display: none;
}

如果您不希望选择项目列表增加，您可以通过在下拉设置中添加badgeShowLimit 来限制显示的徽章数量p>

【讨论】：