title: Set angular directive attribute by calling function
body: <p>I'm trying to set the value of a directive's attribute by calling a function on the containing page's controller, but it doesn't work as expected. In the code below, the "make" object does not have a "modelList" property, so I must place a separate call to the server to get it for each make.</p>
  
  <pre><code>&lt;div ng-repeat="make in makeList"&gt;
    &lt;model-list-directive model-list="getModelList(make)" /&gt;
  &lt;/div&gt;
  
  app.controller("myController",function($scope) {
    $scope.getModelList = function(make) {
    return null;
    //return myService.getModelList(make);
   };
  })
  
  app.directive("modelListDirective",function() {
    restrict:'E',
    scope: {
      modelList: '='
    },
    template: '&lt;ul&gt;&lt;li ng-repeat="model in modelList"&gt;{{model.modelName}}&lt;/li&gt;&lt;/ul&gt;',
    controller: ['$scope', function ($scope) {
    }]
  </code></pre>
  
  <p>If the getModelList() function is set to return null (not commented out in the code), no error is given, but the function is called multiple times (randomly varies between 3 and 5 usually).</p>
  
  <p>The real problem comes when I invoke myService.getModelList(make) (commented out in the code). This results in an endless loop of calls to the service, which crashes the browser.</p>
  
  <p>I'm guessing this is because of two-way binding, but I'm not sure.</p>
  
  <p>Is there a better way to get dynamic data to the directive?</p>