javascript - Populate a Dropdown list by grouping using AngularJs -

I have a dropdown list that is used to keep an email template Now, I classified it in two types of templates Have done There is a 'User Generated Template' and other 'System Generated Templates'

I have the functionality to add templates and they are populated in the dropdown.

The important part here is for templates 'email' and 'system' as the "group". I have a condition that whenever "user templates" are added, they should be placed above "System Template"

I need to populate a dropdown list such as this "user" And "System" templates with AngularJS How do I do this?

Get help!

Assume the following structure for templates:

  $ scope. Templates = [{type: 'email', name: 'template u 1'}, {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'}];  

If you want to group them by type in the dropdown, then you will declare your code as select element:

  & Lt; Template type template by template for template "ng-model =" template "ng-option =" choose template.name "> gt; option value = '' & gt; select a template & lt; / option & See