title: Passing a promise to Lazy load Select in Angular JS
body: <p>I found the jsfiddle below and I want to make the options load from a promise passed into the select tag attribute that I already have in the scope... i'm a bit of a noob when it comes to passing data into directive attributes... I just want the select to show the loading and then after the promise is loaded, then the data...</p>
  
  <p>Example here (Assuming myData is an array in the $scope)</p>
  
  <pre><code> &lt;select ng-model="select.value" ng-options="o.Description for o in select.options" lazy-load-options="" data-options="select.options" option-source="myData"&gt;
      &lt;option value=""&gt; - Select - &lt;/option&gt;
  &lt;/select&gt;
  </code></pre>
  
  <p><a href="http://jsfiddle.net/TigerC10/g862L/" rel="nofollow">http://jsfiddle.net/TigerC10/g862L/</a></p>
  
  <pre><code>   link: function($scope, $element, $attrs, $ngModel){
          // Ajax loading notification
          $scope.options = [
              {
                  Description: "Loading..."
              }
          ];
  
          // Control var to prevent infinite loop
          $scope.loaded = false;
  
          $element.bind('mousedown', function() {
  
              // Use setTimeout to simulate web service call
              setTimeout(function(){
                  if(!$scope.loaded) {
                      $scope.$apply(function(){
                          $scope.options = [
                              {
                                  Description: "Option 1"
                              },
                              {
                                  Description: "Option 2"
                              },
                              {
                                  Description: "Option 3"
                              }
                          ];
                      });
  </code></pre>