Angularjs依赖注入解决

发布时间：2020-12-17 07:39:09 所属栏目：安全来源：网络整理

导读：我想在MyCtrl1中使用适当的依赖注入来注入MyCtrl1.resolve对象的字段.我尝试了许多不同的组合,试图注入@ MyCtrl1.resolve等没有运气. @MyCtrl1 = ($scope,$http,batman,title) - $scope.batman = batman.data $scope.title = title.data@MyCtrl1.resolve = {

我想在MyCtrl1中使用适当的依赖注入来注入MyCtrl1.resolve对象的字段.我尝试了许多不同的组合,试图注入@ MyCtrl1.resolve等没有运气.

@MyCtrl1 = ($scope,$http,batman,title) ->
  $scope.batman = batman.data
  $scope.title = title.data

@MyCtrl1.resolve = {
 batman: ($http) ->
   $http.get('batman.json')
 title: ($http) ->
   $http.get('title.json')
}
#@MyCtrl1.$inject = ['$scope','$http'] -- commented out because not sure how to inject resolve fields

 angular
.module( 'app',[])
.config( ['$routeProvider','$locationProvider',($routeProvider,$locationProvider)->
  $locationProvider.html5Mode(true)

  $routeProvider.when('/',{templateUrl: 'index.html',controller: MyCtrl1,resolve: MyCtrl1.resolve})
  $routeProvider.otherwise({redirectTo: '/'})
])

angular.bootstrap(document,['app'])

Resolve是路由的属性,而不是控制器.控制器将注入在路由级别上定义的依赖关系,无需在控制器上指定解析属性.

以您的一个示例(转换为JavaScript),您将一如既往地定义控制器,即：

MyCtrl1 = function($scope,title) {
  $scope.batman = batman.data;
  $scope.title = title.data;
}

然后在路由上的resolve属性：

angular.module('app',[]).config(['$routeProvider',function($routeProvider,$locationProvider) {
  $locationProvider.html5Mode(true)

  $routeProvider.when('/',resolve: {
    batman: ['$http',function($http) {
      return $http.get(..).then(function(response){
         return response.data;
      });
    }],title: ['$http',function($http) {
      return //as above
    }]
  }});
  $routeProvider.otherwise({redirectTo: '/'});
}]);

如果要使用路由的解析部分来缩小代码,则需要使用数组样式的注释 – 我已将其包含在上面的示例中.

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!