angularjs - Angularjs 将控制器解析为字符串

Question

我编写角度控制器的风格是这样的（使用控制器名称而不是函数）

angular.module('mymodule', [
])
    .controller('myController', [
        '$scope',
        function($scope) {
            // Some code here

        }
    ]);

我现在需要的是在提供我想要定义解析部分的路线时：

 $routeProvider.when('/someroute', {
        templateUrl: 'partials/someroute.html', 
        resolve: myController.resolve}) // THIS IS THE CRITICAL LINE

由于控制器被定义为名称，如何完成下面的解析部分？

为了更详细地说明，我想在解析路由之前从服务器加载一些数据，然后在控制器中使用这些数据。

更新：更准确地说，我希望每个模块都有其“resolve”函数，该函数将在执行该控制器的 root 之前调用。这篇文章中的解决方案（由 Misko Hevery 回答）完全符合我的要求，但我没有将控制器作为函数，而是作为名称。

Answer 1

控制器定义和解析部分将在路由定义中单独指定。

如果您在模块级别定义控制器，则需要将它们作为字符串引用，因此：

 $routeProvider.when('/someroute', {
        templateUrl: 'partials/someroute.html', 
        controller: 'myController',
        resolve: {
          myVar: function(){
            //code to be executed before route change goes here
          };
        });

上面的代码还展示了如何定义一组将在路由更改之前解析的变量。解析后，这些变量可以注入到控制器中，因此以上面代码段中的示例为例，您可以像这样编写控制器：

.controller('myController', ['$scope', 'myVar', function($scope, myVar) {
            // myVar is already resolved and injected here
        }
    ]);

该视频也可能有所帮助：http ://www.youtube.com/watch?v=P6KITGRQujQ

Answer 2

@pkozlowski.opensource 的答案有效，但我真的不想弄乱我的路由和控制器，因为我总是将它分开（与 Yo Generator）。实际上，我们也可以将 controller 和 resolve(r) 都作为string/name（不是函数）。

angular.module('mymodule', [
])
  .controller('myController', [
      '$scope', 'myModelCombination'
      function($scope, myModelCombination) {
          // myModelCombination[0] === (resolved) myModel 
          // myModelCombination[1] === (resolved) myModel2

      }
  ])
  .controller('myController2', [
      '$scope', 'myModel'
      function($scope, myModel) {
          // Some code here

      }
  ])
  .factory('myModel', [
      '$scope',
      function($scope) {
          // return a promise

      }
  ])
  .factory('myModel2', [
      '$scope',
      function($scope) {
          // return a promise

      }
  ])
  .factory('myModelCombination', [
      '$scope', 'myModel', 'myModel2'
      function($scope) {
          return $q.all(['myModel', 'myModel2']);

      }
  ]);

然后在你的路由文件中添加这个

$routeProvider.when('/someroute', {
    templateUrl: 'partials/someroute.html', 
    resolve: ['myModel'] //ALWAYS IN ARRAY)
});
$routeProvider.when('/myModelCombination', {
    templateUrl: 'partials/someroute2.html', 
    resolve: ['myModel'] //ALWAYS IN ARRAY)
});

http://docs.angularjs.org/api/ng .$routeProvider

Answer 3

@TruongSinh 答案对我有用，比在路由器中具有附加功能要好得多。我对其进行了一些调整，因为它返回的是延迟对象而不是实际解析的数据。

$routeProvider.when('/someroute', {
    templateUrl: 'partials/someroute.html', 
    controller: 'SomeController',
    resolve: {
       myModel: 'myModel'
    }
});

Answer 4

这也可以

var MyController = myApp.controller('MyController', ['$scope', 'myData', function($scope, myData) {
  // Some code here
}]);

MyController.resolve = {
  myData: ['$http', '$q', function($http, $q) {
    var defer = $q.defer();

    $http.get('/foo/bar')
      .success(function(data) {
        defer.resolve(data);
      })
      .error(function(error, status) {
        defer.reject(error);
      });

    return defer.promise;
  }]
};