===== Установка =====

====Зависимости====

  * Angular >=1.2.18
  * ngSanitize module
  * jQuery ( optional for older browser support )
  * Bootstrap (v3)/Select2/Selectize CSS as appropriate

Совместимость браузера начиная с Internet Explorer 8 и Firefox 3.6.


====Устанавливать====

Есть несколько способов добавить необходимые файлы:
  - Склонировать и подключить файлы
  - Ссылка на CDN
  - Установить через Bower и подключить файлы //bower install angular-ui-select//

расположение скриптов
  * //bower_components/angular-ui-select/dist/select.js//
  * //bower_components/angular-ui-select/dist/select.css//

----

Для поддержки IE8 / FF3.6 необходимо подключить:

<code html>
  <!--
    IE8 support, see AngularJS Internet Explorer Compatibility http://docs.angularjs.org/guide/ie
    For Firefox 3.6, you will also need to include jQuery and ECMAScript 5 shim
  -->
  <!--[if lt IE 9]>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.js"></script>
    <script src="http://cdnjs.cloudflare.com/ajax/libs/es5-shim/2.2.0/es5-shim.js"></script>
    <script>
      document.createElement('ui-select');
      document.createElement('ui-select-match');
      document.createElement('ui-select-choices');
    </script>
  <![endif]-->
</code>

Для RequireJS ваша установка может выглядеть так:

<code javascript>
require.config({
    paths: {
        'angular': 'bower_components/angular/angular',
        'angular-ui-select': 'bower_components/angular-ui-select/dist/select'
    },
    shim: {
        'angular-ui-select': ['angular']
    }
});
</code>
Включите в свое приложение модули ui.select и ngSanitize

<code javascript>
var module = angular.module('myapp', ['ui.select', 'ngSanitize']);
</code>

====Базовый пример====

Основное использование директивы в html

<code html>
<ui-select ng-model="selected.value">
    <ui-select-match>
        <span ng-bind="$select.selected.name"></span>
    </ui-select-match>
    <ui-select-choices repeat="item in (itemArray | filter: $select.search) track by item.id">
        <span ng-bind="item.name"></span>
    </ui-select-choices>
</ui-select>
</code>

С соответствующим  angular controller:
<code javascript>
angular.module('app')
.controller('ctrl', ['$scope', function ($scope){
    $scope.itemArray = [
        {id: 1, name: 'first'},
        {id: 2, name: 'second'},
        {id: 3, name: 'third'},
        {id: 4, name: 'fourth'},
        {id: 5, name: 'fifth'},
    ];

    $scope.selected = { value: $scope.itemArray[0] };
}]);
</code>

<note>
В зависимости от того, какая тема используется, требуется включение дополнительных таблиц стилей, чтобы в раскрывающемся списке отображался пользовательский интерфейс
</note>