AngularJS下拉分组

Question

如何在Angularjs中对下拉值进行分组？

HTML：

<div ng-model="tsInput" id="tsInput"
    name="tsInput" multi-select input-model="atsInDB"
    output-model="atsOut" button-label="shortenedName"
    item-label="shortenedName" tick-property="ticked" max-height="500px"
    selection-mode="single" max-labels="0" orientation="vertical"
    default-label="{{'MUSELECTED'|translate}}" helper-elements="filter"
    on-item-click="updateProfileList()"
    on-enter="handleInput(labelFilter)"
    group-property="categoryName">
</div>

Js代码

tsInput = 
SkillNotInProfile: true
categoryName: "Others"
categoryUUID: ""
description: "Test description"
name: "CSV"
shortenedName: "<span title="Comma-separated values (CSV)">Others : CSV</span>"

我希望像https://www.w3schools.com/tags/tryit.asp?filename=tryhtml_optgroup这样的分组下拉值 请注意，上面的链接仅是输出参考。