AngularJS Error: $injector:unpr Unknown Provider

后端未结

关注

 13  859

I\'m trying to build my own service by following the example in the documentation for the factory methodology. I think I\'ve done something wrong however because I continue

相关标签:

13条回答

名媛妹妹

2020-12-13 09:02

When you are using ui-router, you should not use ng-controller anywhere. Your controllers are automatically instantiated for a ui-view when their appropriate states are activated.

0 讨论(0)
发布评论:

提交评论
- 加载中...

南笙

2020-12-13 09:04

Spent a few hours trying to solve the same. This is how I did it:

app.js:

var myApp = angular.module( 'myApp', ['ngRoute', 'ngResource', 'CustomServices'] );

CustomServices is a new module I created and placed in a separate file called services.js

_Layout.cshtml:

<script src="~/Scripts/app.js"></script>
<script src="~/Scripts/services/services.js"></script>

services.js:

var app = angular.module('CustomServices', []); 
app.factory( 'GetPeopleList', ['$http', '$log','$q', function ( $http, $log, $q )
{
    //Your code here
}

app.js

myApp.controller( 'mainController', ['$scope', '$http', '$route', '$routeParams', '$location', 'GetPeopleList', function ( $scope, $http, $route, $routeParams, $location, GetPeopleList )

You have to bind your service to your new module in the services.js file AND of course you have to use that new module in the creation of your main app module (app.js) AND also declare the use of the service in the controller you want to use it in.

0 讨论(0)

遥遥无期

2020-12-13 09:04
I got this error writing a Jasmine unit test. I had the line:
```
angular.injector(['myModule'])
```
It needed to be:
```
angular.injector(['ng', 'myModule'])
```
0 讨论(0)
发布评论:

提交评论
- 加载中...

北海茫月

2020-12-13 09:11

Your angular module needs to be initialized properly. The global object app needs to be defined and initialized correctly to inject the service.

Please see below sample code for reference:

app.js

var app = angular.module('SampleApp',['ngRoute']); //You can inject the dependencies within the square bracket    

app.config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) {
  $routeProvider
    .when('/', {
      templateUrl:"partials/login.html",
      controller:"login"
    });

  $locationProvider
    .html5Mode(true);
}]);

app.factory('getSettings', ['$http', '$q', function($http, $q) {
  return {
    //Code edited to create a function as when you require service it returns object by default so you can't return function directly. That's what understand...
    getSetting: function (type) { 
      var q = $q.defer();
      $http.get('models/settings.json').success(function (data) {
        q.resolve(function() {
          var settings = jQuery.parseJSON(data);
          return settings[type];
        });
      });
      return q.promise;
    }
  }
}]);

app.controller("globalControl", ['$scope','getSettings', function ($scope,getSettings) {
  //Modified the function call for updated service
  var loadSettings = getSettings.getSetting('global');
  loadSettings.then(function(val) {
    $scope.settings = val;
  });
}]);

Sample HTML code should be like this:

<!DOCTYPE html>
<html>
    <head lang="en">
        <title>Sample Application</title>
    </head>
    <body ng-app="SampleApp" ng-controller="globalControl">
        <div>
            Your UI elements go here
        </div>
        <script src="app.js"></script>
    </body>
</html>

Please note that the controller is not binding to an HTML tag but to the body tag. Also, please try to include your custom scripts at end of the HTML page as this is a standard practice to follow for performance reasons.

I hope this will solve your basic injection issue.

0 讨论(0)

予麋鹿

2020-12-13 09:11

This error is also appears when one accidntally injects $scope into theirs factory:

angular.module('m', [])
    .factory('util', function ($scope) { // <-- this '$scope' gives 'Unknown provider' when one attempts to inject 'util'
       // ...
    });

0 讨论(0)

一个人的身影

2020-12-13 09:11

I was getting this problem and it turned out I had included my controller both in ui.router and in the html template as in

.config(['$stateProvider',
  function($stateProvider) {
    $stateProvider.state('dashboard', {
      url: '/dashboard',
      templateUrl: 'dashboard/views/index.html',
      controller: 'DashboardController'
    });
  }
]);

and

<section data-ng-controller="DashboardController">

0 讨论(0)