anuglar-UI Select2 AJAX example

<!DOCTYPE html>
<html ng-app="MyApp">

  <head>
    <link data-require="select2@*" data-semver="3.4.5" rel="stylesheet" href="//cdn.jsdelivr.net/select2/3.4.5/select2.css" />
    <script data-require="jquery@*" data-semver="2.0.3" src="http://code.jquery.com/jquery-2.0.3.min.js"></script>
    <script data-require="select2@*" data-semver="3.4.5" src="//cdn.jsdelivr.net/select2/3.4.5/select2.min.js"></script>
    <script data-require="angular.js@*" data-semver="1.2.5" src="http://code.angularjs.org/1.2.5/angular.js"></script>
    <script data-require="ui-select2@*" data-semver="0.0.4" src="//rawgithub.com/angular-ui/ui-select2/master/src/select2.js"></script>
    <link rel="stylesheet" href="style.css" />
    <script src="script.js"></script>
  </head>

  <body ng-controller="MyController">
    <h1>Select2 test</h1>
    
    <code>{{testModel | json}}</code><br>
    <input ui-select2="select2Options" ng-model="testModel" style="width:200px" />
  </body>

</html>

// Code goes here
var myAppModule = angular.module('MyApp', ['ui.select2']);

myAppModule.controller('MyController', function($scope) {
    $scope.select2Options = {
      ajax: {
        url: "data.json",
        data: function (term, page) {
          return {}; // query params go here
        },
        results: function (data, page) { // parse the results into the format expected by Select2.
          // since we are using custom formatting functions we do not need to alter remote JSON data
          return {results: data}
        }
      }
    }
});

/* Styles go here */

.select2-container {
  width: 200px;
}

[
  {
    "id" : 1,
    "text" : "First"
  },
  {
    "id" : 2,
    "text" : "Second",
    "color" : "red"
  },
  {
    "id" : 3,
    "text" : "Third",
    "color" : "orange"
  },
  {
    "id" : 4,
    "text" : "Fourth",
    "color" : "red"
  },
  {
    "id" : 5,
    "text" : "Fifth",
    "color" : "pink"
  },
  {
    "id" : 6,
    "text" : "Sixth",
    "color" : "yellow"
  },
  {
    "id" : 7,
    "text" : "Seventh",
    "color" : "blue"
  },
  {
    "id" : 8,
    "text" : "Eighth",
    "color" : "blue"
  },
  {
    "id" : 9,
    "text" : "Ninth",
    "color" : "purple"
  },
  {
    "id" : 10,
    "text" : "Tenth",
    "color" : "green"
  }
]