我的表单中有一个 md-select ,其中包含多个选项(与Angular Material 站点中的演示 https://material.angularjs.org/latest/demo/select)。它在其输入字段中显示以逗号分隔的选定选项列表。有什么办法可以改变分隔符吗? (例如将逗号更改为星号或其他 UTF-8 字符)。
你可以用纯 CSS 做一些事情。您应该使用隐藏逗号visibility: collapse
之后,您可以添加一个 Unicode 图标:after
or :before
伪元素。
PLUNKER https://plnkr.co/edit/mkYWRo597YCo36zgNcai?p=preview
HTML
<md-select class="my-select" ng-model="vm.selectedItem" multiple>
<md-option ng-value="item.id" ng-repeat="item in vm.items">{{ item.name }}</md-option>
</md-select>
CSS
.my-select[multiple] .md-select-value span:first-child {
visibility: collapse;
}
.my-select[multiple] .md-select-value .md-text {
display: inline-block !important;
visibility: visible;
}
.my-select[multiple] .md-select-value .md-text:not(:last-child):after {
content: '\2605'; /* star */
margin: 0 -5px 0 5px;
}
在那里你去字形列表 https://css-tricks.com/snippets/html/glyphs/您可以使用。
另外,您还可以用 css 添加一个很棒的字体图标 https://stackoverflow.com/questions/20782368/use-font-awesome-icon-as-css-content如果你想。
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)