accessing $window and $logProvider in angular - angularjs

When I am trying this (CoffeeScript)
.config ['$logProvider', '$window', ($logProvider, $window) ->
//...do something with parameters...
]
I get "$window not defined", and whe I try run block
.run ['$logProvider', '$window', ($logProvider, $window) ->
//...do something with parameters...
]
I get "Unknown provider: $logProviderProvider <- $logProvider"
I there any way I can use both?

Providers are only scoped at config time, then their provided service is available:
.config ['$logProvider', ($logProvider) ->
$logProvider.debugEnabled(true);
]
.run ['$log', '$window', ($log, $window) ->
$log.debug('hello logger!');
]
Note that $window is not a provider thus can't be configured.
Your answer is: .config handles pure module configuration. Once done, factories are ready so you can use everything you need. In your case, you actually need $log and $window.

Related

angular - circular dependency

For the first time ever I am facing this issue and I am struggling a lot in trying to figure out why and how to fix it.
I have two services, service1 and service 2, but apparently, there's a circular dependency like this:
serv1 <- serv2 <- serv1
The services code is the following:
angular.module('service1', [])
.service 'serv1', ['$rootScope','$http','$location','serv2',
function ($rootScope, $http, $location, serv2){
serv2.doMyOtherThing(...)
}
]
and service2 is the following:
angular.module('service2', [])
.service 'serv2', ['$rootScope','$http','$location','serv1',
function ($rootScope, $http, $location, serv1){
serv1.doMyThing(...)
}
]
why is there a circular dependency? how do I solve this?
Each service is specific for something (serv1 variou utilities and serv2 array utilities) and I need to use the two together sometimes but it's currently not possible.
Thanks for any help
If you see this Miško Hevery's blog you will understand that :
...
.service 'serv1', ['$rootScope','$http','$location','serv2'
.service 'serv2', ['$rootScope','$http','$location','serv1',
The serv1 needs serv2 and serv2 needs serv1. And this is going to train a circular dependency.
So you could use a third service
Or you can resolve this like this :
angular.module('service1', [])
.service 'serv1', ['$rootScope','$http','$location','serv2',
function ($rootScope, $http, $location, serv2){
serv2.doMyOtherThing(...)
}
]
angular.module('service2', [])
.service 'serv2', ['$rootScope','$http','$location','$injector',
function ($rootScope, $http, $location, $injector){
var serv1 = $injector.get('serv1');
serv1.doMyThing(...)
}
]
Use a third service, use that third service in the other ones.
example:
angular.module('service1',[])
.service 'serv1' [..,'servCommon', function(..,servCommon){}]
angular.module('service2',[])
.service 'serv2' [..,'servCommon', function(..,servCommon){}]
angular.module('serviceCommon',[])
.service 'servCommon' [.., function(..){}]
Add some common function in that servCommon and use them from other two.
Hope this helps.

AngularJS: Error: $q is not defined

I want to make a promise in my angularjs controller. I took the example from the Angularjs Doc and pasted it in my controller. When I try to run the code, the console prints:
Error: $q is not defined
Why is this error happening and how do I solve it?
I tried to google this problem, but most questions revolve about more specific problems than mine.
A (german) guide tells me that promises are already in angular js implemented and there is no need to add anything to it.
EDIT:
this is my controller:
app.controller("ArgumentationController", [
'$scope', '$resource',
function($scope, $resource) {
EDIT2:
A commentor suggested to inject $q. I did this:
app.controller("ArgumentationController", [
'$scope', '$resource', '$q',
function($scope, $resource, $q) {
Now, the error does not occur.
From your past code, no need of $resource in your code. Instead inject $q in it.
As you are creating a dummy promise using $q, make following changes.
app.controller("ArgumentationController", [
'$scope', '$q',
function($scope, $q) {

Angular injector error with minified JavaScript

I have been struggling to find a solution for this problem:
I am using Angular.js on my site.
I use CoffeeScript to write my JavaScript in Visual Studios 2012. When I save my CoffeeScript - both a minified and un-minified version of the JavaScript file is saved.
While using any minified version of JavaScript files on my webpage I keep getting this error:
Error: $injector:unpr
Unknown Provider
Unknown provider: nProvider <- n
This error results from the $injector being unable to resolve a required dependency. To fix this, make sure the dependency is defined and spelled correctly. For example:
If I don’t use the minified version everything works fine.
Here is how I use angular to declare my App in each JavaScript file
(function() {
var myApp;
myApp = angular.module("myApp", ['uploaddirective']);
myApp.controller("videoController", function($scope, $http, $compile) {
Can anyone help me to resolve this issue?
Use array notation for minification-safe dependency injection:
myApp.controller("videoController", ['$scope', '$http', '$compile', function($scope, $http, $compile) {
Another option is to use build task to automatically annotate injections for you:
// #ngInject
myApp.controller("videoController", function($scope, $http, $compile) {
You will need grunt or gulp plugin for this, like ngAnnotate.
https://docs.angularjs.org/guide/di
When you minifying the above code you will get something like
a.controller("videoController", function(x, y, z) {...
note that $scope, $http, $compile are replaced with x, y, z.
So when angular starts to execute Controller can't find the injectors because $scope, $http, $compile are replaced with x, y, z and there are no inject-able providers as x, y or z, so angular will trigger a error saying Unknown Provider.
solution 1
you can follow Inline Array Annotation as,
myApp.controller("videoController", ['$scope', '$http', '$compile', function($scope, $http, $compile) {...
after minifying this you will get something like
a.controller("videoController", ['$scope', '$http', '$compile', function(x, y, z) {...
minifying process doesn't effect on strings, here angular will use a array with strings that will match the providers. Here angular will match the x with $scope and so on.
solution 2
$inject Property Annotation
var MyController = function($scope, $http, $compile) {
// controller function ...
}
MyController.$inject = ['$scope', '$http', '$compile'];
myApp.controller("videoController", MyController);
additionally check ng-annotate

Injecting a factory in Angular

Hello I can't call a factory function. When I use it I have the next message
Here my factory
And the controller with the call
When I try to print Account, it is undefined. Can anyone see my error? Thanks
It's because Account is not declared as a dependency of the controller. Change it to:
.controller('forgotController', ['$scope', '$location', 'Account',
function($scope, $location, Account) {
For this to work, you need to make sure Account is available to the injector for your module. So when you declare the module that your controller is in, if it's not in the same module, be sure to include AccountService as a module dependency. For example:
angular.module('ForgotModule', ['AccountService'])
.controller('forgotController', ['$scope', '$location', 'Account',
function($scope, $location, Account) {

"Unknown Provider" in AngularJS

I'm trying to load a few services and controllers into an AngularJS app but I am facing an "Unknown Provider" message that I don't understand.
Unknown provider: $scope, accountManagementServiceProvider <- $scope,
accountManagementService <- RegistrationSigninControllerS/<#https:
//ajax.googleapis.com/ajax/libs/angularjs/1.3.13/an… id
My app.js is like this
var dataApp = angular.module('niwadataApp', ['ngRoute','niwaDataControllers']);
along with some config stuff and routes etc etc. Then in a separate file I define some settings and attempt to load the services/controller
dataApp.value('isEmbedded', false); //And the other 'auth' settings
dataApp.service('authenticationService', ['$http', '$q', '$rootScope', '$location', 'authTimeout', 'authTimeoutUrl', 'authUrl',AuthenticationServiceImpl]);
dataApp.factory('authenticatingProxyService', ['authenticationService', 'isEmbedded', '$http', '$q', '$window', '$rootScope', AuthenticatingProxyServiceImpl]);
dataApp.service('accountManagementService', ['$q', 'authenticatingProxyService', AccountManagementServiceImpl]);
dataApp.controller('RegistrationSigninController', ['$scope, accountManagementService', RegistrationControllerImpl]);
The classes are all defined in their own files that are loaded before app.js, e.g.
var AccountManagementServiceImpl = function($q, auth) {
According to the error message it is looking for accountManagementServiceProvider but I've got a class called accountManagementServiceImpl and that is what I've specified in the dataApp.service( call. Have I missed something in the documentation that defines class names must end with 'Provider'? Which provider does it not know about? As far as I can see each controller, service and factory defines its requirements and should be able to be created.
You are missing some quotes.
Change this:
dataApp.controller('RegistrationSigninController', ['$scope, accountManagementService', RegistrationControllerImpl]);
to this:
dataApp.controller('RegistrationSigninController', ['$scope', 'accountManagementService', RegistrationControllerImpl]);

Resources