使用 AngularJs 分组填充下拉列表

Question

我有一个用于保存电子邮件模板的下拉列表。现在，我将其分为两种类型的模板。一个是 'User Generated Templates' 和另一个 'System Generated Templates' 。

我有继续添加模板的功能，它们会填充到下拉列表中。

此处的重要部分是 "Group" 模板为 'Email' 和 'System'。我有一个条件，每当添加 "USER TEMPLATES" 时，它们都应该放在 "system templates"

之上

我需要填充一个下拉列表，使其根据 "User" 和 "System" 模板与 AngularJS 进行分组。我该怎么做呢？

寻求帮助！

Answer 1

假设模板结构如下：

$scope.templates = [{
    type: 'Email',
    name: 'Template u1'
}, {
    type: 'Email',
    name: 'Template u2'
}, {
    type: 'System',
    name: 'Template s1'
}, {
    type: 'Email',
    name: 'Template u3'
}, {
    type: 'System',
    name: 'Template s2'
}, {
    type: 'System',
    name: 'Template s3'
}];

如果您想在下拉列表中按类型对它们进行分组，您将像这样声明您的 select 元素：

<select ng-model="template" ng-options="template.name group by template.type for template in templates">
    <option value=''>Select a template</option>
</select>

参考这个fiddle

使用 AngularJs 分组填充下拉列表

Populate a Dropdown list by grouping using AngularJs

html

javascript

php

angularjs

drop-down-menu