角度依赖注入。我到底在做什么错了？

下面是我想要做的一个简单例子。我将在前言中说，我已经在一个角度已经建成的项目上作为维护人员工作了3周，而且我还有一个未成年人，至多对角度的最新理解。我可以使用控制器和视图和模型，一切都很好。但是当它来了解依赖注入的时候，我被模糊的错误所困扰。现在是时候我需要了解喷油器的工作原理了，所以这里有一个我为自己的学习目的而构建的小型测试应用程序。我实际上并不知道这是否是构建角度应用程序的正确方法。我发现最令人困惑的文档。角度依赖注入。我到底在做什么错了？

HTML

<div ng-app="app"> 
<div ng-controller="EC as e"> 
</div> 
</div>

的JavaScript

var app = angular.module('app',[]); 

app.config(['$httpProvider', function($httpProvider) { 
    $httpProvider.interceptors.push(function($q, $window) { 
     return { 
      'request': function(config) { 
       config.headers['Authorization'] = 'bearer '+ $window.localStorage.token; 
       return config; 
      } 
     }; 
    }); 
}]); 

function EC($scope,$http,$window) { 

    var vm = this; 

    vm.api = function(resource){ 
     return ('https://api.website.com/v1/'+resource).replace('//','/'); 
    }; 

    $window.localStorage.token = 'foobar'; 

    $http.put(vm.api('/users/me'), { loggedIn: true }).then(function(response){ 

     $http.get(vm.api('/users/me')).then.function(response){ 
      vm.user = response.data; 
     }); 

    }); 

} 

EC.$inject = ['$scope','$http','$window']; 

app.controller('EC',EC); 

app.run();

我以为已经行EC.$inject = ['$scope','$http','$window'];会保证我的控制器构造函数与这些服务调用，或任何他们被称为地狱作为论据。显然，情况并非如此。有人能像我这样向我解释5这是如何工作的，为什么我得到一个错误？

错误消息：

Error: [$injector:modulerr] http://errors.angularjs.org/1.5.6/$injector/modulerr

来源

2016-09-23 r3wt

这只是坏的标记。 Fiddle展示你的工作代码

变化：

.then 
     .function(response) { 
     vm.user = response.data;

到

.then(function(response) { 
     vm.user = response.data;

来源

2016-09-23 20:17:08 Nix

实际的问题是，我不知道我必须包含额外的文件$ http可用。你的小提琴实际上显示了什么是错误的，但以不同的方式。我提供的代码只是一个虚拟的，所以语法错误是一个红色的鲱鱼，我努力做一个简单的例子来说明问题。在应用缺少的资源之后，我的代码现在可以工作。我感谢你的努力。 – r3wt

这是100％的注射问题。我毫不怀疑代码中还有其他的错误。 – Nix

而你没有包含$ http – Nix

改写了控制器块遵循更conventionaly注射。可以锻炼你。还从$ http调用中删除了双重响应回调，并返回了$ http.get（）承诺。

angular.module('app', []) 



.config(['$httpProvider', function($httpProvider) 
{ 
    $httpProvider.interceptors.push(function($window) 
    { 
    return { 
     request: function(config) 
     { 
     config.headers['Authorization'] = 'bearer '+ $window.localStorage.token; 
     return config; 
     } 
    }; 
    }); 
}]) 



.controller('EC', ['$scope', '$http', '$window', function($scope, $http, $window) 
{ 
    var buildApiString = function(resource) 
    { 
    return ('https://api.website.com/v1/'+resource).replace('//','/'); 
    }; 


    $window.localStorage.token = 'foobar'; 


    $http.put(buildApiString('/users/me'), { loggedIn: true }).then(function() 
    { 
    return $http.get(buildApiString('/users/me')).then(function(response) 
    { 
     $scope.user = response.data 
    }); 
    }); 
}]);

来源

2016-09-23 20:22:07 gmustudent

角度依赖注入。我到底在做什么错了？

回答

相关问题