Unsure what Unknown Provider: $attrsProvider <- $attrs means? - angularjs

I am encountering the following error when I run my Karma Unit Tests:
Error: [$injector:unpr] Unknown provider: $attrsProvider <- $attrs
http://errors.angularjs.org/1.2.16/$injector/unpr?p0=%24attrsProvider%20%3C-%20%24attrs
at /home/ubuntu/vantage/core/static/core/js/lib/angular.js:78:12
at /home/ubuntu/vantage/core/static/core/js/lib/angular.js:3705:19
at Object.getService [as get] (/home/ubuntu/vantage/core/static/core/js/lib/angular.js:3832:39)
at /home/ubuntu/vantage/core/static/core/js/lib/angular.js:3710:45
at getService (/home/ubuntu/vantage/core/static/core/js/lib/angular.js:3832:39)
at invoke (/home/ubuntu/vantage/core/static/core/js/lib/angular.js:3859:13)
at Object.instantiate (/home/ubuntu/vantage/core/static/core/js/lib/angular.js:3880:23)
at /home/ubuntu/vantage/core/static/core/js/lib/angular.js:7134:28
at null.<anonymous> (/home/ubuntu/vantage/ecommerce/js_tests/unit/progress/progressControllersSpec.js:12:20)
at Object.invoke (/home/ubuntu/vantage/core/static/core/js/lib/angular.js:3869:17)
Error: Declaration Location
at window.inject.angular.mock.inject (/home/ubuntu/vantage/core/static/core/js/lib/angular-mocks.js:2132:25)
at null.<anonymous> (/home/ubuntu/vantage/ecommerce/js_tests/unit/progress/progressControllersSpec.js:10:20)
at null.<anonymous> (/home/ubuntu/vantage/ecommerce/js_tests/unit/progress/progressControllersSpec.js:5:5)
at /home/ubuntu/vantage/ecommerce/js_tests/unit/progress/progressControllersSpec.js:3:1
TypeError: Cannot call method 'expectGET' of undefined
at null.<anonymous> (/home/ubuntu/vantage/ecommerce/js_tests/unit/progress/progressControllersSpec.js:380:18)
Chrome 33.0.1750 (Linux): Executed 42 of 45 (1 FAILED) (0 secs / 0.483 secs)
Chrome 33.0.1750 (Linux) Unit Test: ProgressController ProgressController should expect showDetailedSection to be false on initialization FAILED
Error: [$injector:unpr] Unknown provider: $attrsProvider <- $attrs
Anyone know what this means exactly and how to fix it?
Thanks :)

The solution to this ended up being pretty obscure.
The issue was that the bootstrap-ui package actually has a ProgressController in it. So our controller got stomped on. The test was trying to create an instance of our ProgressController but ended up with the one from bootstrap-ui.
Simply renaming our controller fixed everything.

Related

Hard to trace real root cause under chrome dev tools

I've changed dozens of controllers, services, and html
And got an Unknown provider exception
Unknown provider: bankServiceProvider <- bankService <- BanksBaseCtrl
However, it didn't tell me this is due to which file.
The debug message on chrome console is helpless.
Is there any useful way to trace the buggy source file?
Thanks so much
angular.js:12477 Error: [$injector:unpr] Unknown provider: bankServiceProvider <- bankService <- BanksBaseCtrl
http://errors.angularjs.org/1.4.7/$injector/unpr?p0=bankServiceProvider%20%3C-%20bankService%20%3C-%20BanksBaseCtrl
at http://dev.co/libs/angular/angular/angular.js:68:12
at http://dev.co/libs/angular/angular/angular.js:4289:19
at Object.getService [as get] (http://dev.co/libs/angular/angular/angular.js:4437:39)
at http://dev.co/libs/angular/angular/angular.js:4294:45
at getService (http://dev.co/libs/angular/angular/angular.js:4437:39)
at Object.invoke (http://dev.co/libs/angular/angular/angular.js:4469:13)
at extend.instance (http://dev.co/libs/angular/angular/angular.js:9136:34)
at nodeLinkFn (http://dev.co/libs/angular/angular/angular.js:8248:36)
at compositeLinkFn (http://dev.co/libs/angular/angular/angular.js:7680:13)
at publicLinkFn (http://dev.co/libs/angular/angular/angular.js:7555:30) <div ui-view="" class="fade-in ng-scope">

It means you injected bankService into BanksBaseCtrl and angular couldn't resolve bankService.
Verify that you properly registered bankService (with that exact name) with the angular module:
angular.module('yourapp').service('bankService',function(){...});
or, alternatively, correct the injected service name within BanksBaseCtrl.

Angular Unknown provider error: what's the meaning of the chain of functions, mentioned in error message?

I get an error from Angular:
angular.js:68 Uncaught Error: [$injector:unpr] Unknown provider: utilProvider <- util <- AuthInterceptor <- $http <- $templateFactory <- $view <- $state
I'm trying to localize the error, but I don't understand the meaning of chain of functions that the error message mensions:
utilProvider <- util <- AuthInterceptor <- $http <- $templateFactory <- $view <- $state
Can you explain, what are these guys? What's the order of them? It looks like a dependency stack, but is it right-to-left or left-to-right?
This error stack is to be read Left to Right.
It doesn't necessarily mean error is in the first object, it rather means error occured when trying to use that first object.
Angular generated error stack offers link to previous error, and you can trace your bug to its origin.
If you are developing in Chrome, the link is clickable in console and leads to Angular website where you can see some description of the error and most common causes.

Error after using ngAnimate: TypeError: Cannot read property 'ng-scope' and 'col-sm-6' of undefined

I've added angular animation to my project. I only placed this to my index.html and app.js. Is there something I've missed? Thanks in advance
Index.html
<script src="http://code.angularjs.org/1.2.1/angular-animate.js"></script>
App.js
angular.module('portfolio', ['ui.bootstrap','ui.router', 'ngAnimate', 'service', 'ctrl'])
Console: Error
TypeError: Cannot read property 'ng-scope' of undefined
at lookup (angular-animate.js:294)
at performAnimation (angular-animate.js:563)
at angular-animate.js:358
at m.$digest (angular.js:16215)
at m.$apply (angular.js:16429)
at g (angular.js:10823)
at t (angular.js:11021)
at XMLHttpRequest.w.onload (angular.js:10962)(anonymous function) # angular.js:12793(anonymous function) # angular.js:9526m.$digest # angular.js:16217m.$apply # angular.js:16429g # angular.js:10823t # angular.js:11021w.onload # angular.js:10962
angular.js:12793
TypeError: Cannot read property 'col-sm-6' of undefined
at lookup (angular-animate.js:294)
at performAnimation (angular-animate.js:563)
at angular-animate.js:358
at m.$digest (angular.js:16215)
at m.$apply (angular.js:16429)
at g (angular.js:10823)
at t (angular.js:11021)
at XMLHttpRequest.w.onload (angular.js:10962)
This question seems very similar to this post AngularJS: $$selectors undefined when trying to use ngAnimate
The suggestion seems to point to a mismatch between angular and angular animate module
I had the same error and the solution was the http. So i upgraded the version and i used this link instead. I hope that helps
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.3/angular-animate.js"></script>

Error: [$injector:unpr] http://errors.angularjs.org/1.3.4/$injector/unpr?p0=%24ngMapProvider%20%3C-%20%24ngMap at Error (native)

I get following error when I run my application. Just want to know what this means if anyone has experienced with the same?
Error: [$injector:unpr] http://errors.angularjs.org/1.3.4/$injector/unpr?p0=%24ngMapProvider%20%3C-%20%24ngMap
at Error (native)
at https://ajax.googleapis.com/ajax/libs/angularjs/1.3.4/angular.min.js:6:416
at https://ajax.googleapis.com/ajax/libs/angularjs/1.3.4/angular.min.js:38:22
at Object.d [as get] (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.4/angular.min.js:36:49)
at https://ajax.googleapis.com/ajax/libs/angularjs/1.3.4/angular.min.js:38:94
at d (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.4/angular.min.js:36:49)
at e (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.4/angular.min.js:36:310)
at Object.instantiate (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.4/angular.min.js:36:451)
at $get (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.4/angular.min.js:75:409)
at http://localhost:11080/angularui/ui-bootstrap-tpls-0.12.0.min.js:8:29473
NOTE: Code is bit complex to publish here.
You're trying to inject/use ngMapProvider in a place where it isn't correctly included as a dependency.
See: https://docs.angularjs.org/error/$injector/unpr

AngularJS linky filter throws an "Unknown Provider" error

Here is the JSFiddle that shows what I'm doing, simply adding a filter to name.
http://jsfiddle.net/9Z5SJ/1/
Error: Unknown provider: linkyFilterProvider <- linkyFilter
at Error (unknown source)
at http://code.angularjs.org/angular-1.0.0rc10.js:2530:15
at Object.getService [as get] (http://code.angularjs.org/angular-1.0.0rc10.js:2658:39)
at http://code.angularjs.org/angular-1.0.0rc10.js:2535:45
at Object.getService [as get] (http://code.angularjs.org/angular-1.0.0rc10.js:2658:39)
at http://code.angularjs.org/angular-1.0.0rc10.js:8956:24
at filter (http://code.angularjs.org/angular-1.0.0rc10.js:5744:14)
at _filterChain (http://code.angularjs.org/angular-1.0.0rc10.js:5735:41)
at statements (http://code.angularjs.org/angular-1.0.0rc10.js:5711:25)
at parser (http://code.angularjs.org/angular-1.0.0rc10.js:5644:13)
Documentation on the linky filter
http://docs.angularjs.org/api/angular.module.ngSanitize.filter.linky
You need to load and include the "sanitize" module to use "linky":
Look for these two things:
1. I added "http://docs.angularjs.org/angular-sanitize-1.0.0rc10.min.js" as a resource
2. I linked it into my module by adding "ngSanitize" to angular.module('myApp',['ngSanitize']);
See here:
http://jsfiddle.net/johnlindquist/y2eJL/

Resources