title: How to use jQuery Select2 with AngularJS
body: <p>I am trying to use jQuery (2.2.1) Select2 (3.5.2) with Angularjs (1.5) but am having a difficult time grabbing the data from the select box.  I have tried <a href="https://github.com/angular-ui/ui-select" rel="nofollow">ui-select</a> and I could retrieve data... but would often crash the browser when searching, was horribly slow and overall unstable (5000-10000 items).  jQuery Select2 is fast and responsive, even with the large number of entries, but I cant seem to get the object when I select an option.  </p>
  
  <pre><code>&lt;head&gt;
      &lt;script src="~/Scripts/angular.min.js"&gt;&lt;/script&gt;
      &lt;script src="~/Scripts/CustomScripts/app.js"&gt;&lt;/script&gt;
      &lt;script src="~/Scripts/jquery-2.2.1.js"&gt;&lt;/script&gt;
      &lt;script src="~/Scripts/select2.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript"&gt;
          $(document).ready(function () {
              $(".sel").select2();
          });
      &lt;/script&gt;
  &lt;head&gt;
  &lt;body ng-app="app" ng-controller="MainCtrl"&gt;
      &lt;select class="sel" data-ng-model="country.selected" ng-options="country.Name for country in countries | orderBy: 'Name'"&gt;
  &lt;body&gt;
  </code></pre>
  
  <p>app.js</p>
  
  <pre><code>var app = angular.module('app', []);
  
  app.controller('MainCtrl', ['$scope', '$http', function ($scope, $http) {
  
      $scope.country = {};
  
      $scope.countries = [{
          name: 'Australia',
      }, {
          name: 'United States'
      }, {
          name: 'United Kingdom'
      }];
  
  }]);
  </code></pre>
  
  <p>Is there a way to get these two working nicely?</p>