Функция углового-ui-router внутри контроллера не является функцией

Question

Я создал контроллер внутри состояния. Обычно мы используем такие обозначения для наших угловых (1.5) компонентов и сервисов с помощью angular.extend(self, {}).

Моя проблема вот когда self.criteria инициализация, вызов браузера self.getAgencies() и возвращает исключение:

Error: self.getAgencies is not a function

(function (app) { 
    'use strict'; 

    app.config(function ($stateProvider) { 
     $stateProvider.state('app.invoice', { 
      url: '/invoice' 
      abstract: true, 
      template: '<ui-view></ui-view>' 
     }) 
     .state('app.invoice.list', { 
      url: '/list?allMyParam', 
      template: '<invoices criteria="$ctrl.criteria"></invoices>', 
      controllerAs: '$ctrl', 
      controller: function ($location) { 
       var self = this; 

       angular.extend(self,{ 
        criteria: { 
         agencies: self.getAgencies() 
        }, 
        getAgencies: function() { 
         if ($location.search().agencies) { 
          return undefined; 
         } else { 
          return ['foo', 'blah']; 
         } 
        } 
       }); 
      } 
     }); 
    }); 
})(angular.module('module', [])); 

Я поставил getAgencies() функции по инициализации критериев прототипа, но это ничего не меняет ,

Я вышел из него, перемещая getAgencies() вне angular.extend(self, {}) как это:

var self = this; 

var getAgencies = function() { 
    if ($location.search().agencies) { 
     return undefined; 
    } else { 
     return ['foo', 'blah']; 
    } 
} 

angular.extend(self, { 
    criteria: { 
     agencies: getAgencies() 
    } 
}); 

Мой код работает так, что это нормально для меня, но я хотел бы понять, почему мой self.getAgencies() не работает, когда этот вызов внутри компонента контроллера работает хорошо, и я сделаю это лучше, если смогу.

Я использую угловой ui-router 0.2.18 с угловым 1.5.0. Благодарим вас за помощь.

Answer 1

Потому что, когда этот код будет достигнут

criteria: { 
    agencies: self.getAgencies() 
}, 

функция angular.extend не была вызвана, и нет никаких причин, почему сами должны содержать функцию getAgencies.

Почему бы не инициализировать агентства после этого?

  angular.extend(self,{ 
       criteria: { }, 
       getAgencies: function() { 
        if ($location.search().agencies) { 
         return undefined; 
        } else { 
         return ['foo', 'blah']; 
        } 
       } 
      }); 

      self.criteria.agencies = self.getAgencies(); 

В качестве альтернативы можно использовать поглотитель и пост-лепешку вызова функции:

 angular.extend(self,{ 
      criteria: { 
       get agencies() { 
       if (!self._agencies) { 
        self._agencies = self.getAgencies(); 
       } 
       return self._agencies; 
       } 
      }, 
      getAgencies: ... 
     });