I must be missing something very simple. I've seen a bunch of examples of angularFireCollection but no examples using in the way i'm using it in a service (perhaps that's the issue?). here's my code which is getting an angular injection error unknown provider:
angular.module('CommentBoxService', [])
.service('CommentBoxSvc', ['$rootScope', '$stateParams', '$http', '$location','angularFireCollection',
function ($rootScope, $stateParams, $http, $location, $firebase, angularFireCollection) {
var commentFireBase = null;
var user; var type;
var getFireBaseRef = function () {
user = ($location.absUrl().split('/'))[4].replace('#', '');
getType();
commentFireBase = angularFireCollection('https://XXX/users/' + user + '/comment-boxes/' + type);
return commentFireBase;
}
return {
getFireBaseRef : getFireBaseRef
}
}]);
am i missing something with the injection method?
Related
So I have two modules each one with one with its own controller and I need to pass an object between them, I seen this can be done with a service, I tried some stuff but I keep getting an "$injector" error in the second module/controller. Please help fix this.
This is my first module/controller with its service:
var appIndex = angular.module("AppIndex", ['datatables', 'datatables.bootstrap', 'ui.select']);
appIndex.service('sharedData', function () {
this.data = {};
this.setData = function (newData) {
this.data = newData;
return this.data;
};
this.getData = function () {
return this.data;
};
});
appIndex.controller("IndexController", function ($scope, $http, $window, sharedData) {
sharedData.setData($scope.referencia);
});
And this is my second module/controller:
var appCna = angular.module("AppCna", ['ui.select', 'AppIndex']);
appCna.controller("CnaController", function ($scope, $http, $window, sharedData) {
$scope.referencia = sharedData.getData();
});
You need to call setData in your first controller
appIndex.controller("IndexController", function ($scope, $http, $window, sharedData) {
sharedData.setData($scope.referencia);
});
So in the end I finally stop trying to use a service to my purpose of passing an object between two modules and what I did was to use the LocalStorage function.
I am trying to inject a custom service to a controller but it give the error that unknown provider. I have attached the relevant code below kindly look in to it as its been a while I am stuck in this problem.I am following coursera's course they are also doing it in the same way but for me its not working.
var app = angular.module('tutorial', ['ngRoute','ngMaterial'])
app.service('myService',
function myService(data) {
var service = this;
service.validator = function(data) {
if (data.name.$valid)
return true
else
return false
}
// return service
}
)
app.controller('myCtrl',['$scope', '$http', '$location', 'myService', myCtrl])
function myCtrl($scope, $http, $location, myService) {
$scope.editorEnabled = false;
myService = this;
$scope.insertemployee = function(empinfo) {
if (myservice.validator(empinfo)) {
console.log(empinfo.name)
console.log(empinfo.email)
console.log(empinfo.address)
$http.post('insertEmp.php',{'name':empinfo.name, 'email': empinfo.email, 'address':empinfo.address}).then(function(data) {
console.log(data)
})
}
}
i have a project that consists of modular angularjs sub apps.
Sub apps reside in their own folders relative the root app folder.
The problem is that i want to include an external module (satellizer) via bower. The module has downloaded correctly and the bower components get injected to the html via gulp/wiredep. All good so far.
The structure of an app with a controller is as follows:
(function () {
'use strict';
angular
.module('foo.bar')
.filter('orderObjectBy', function () {
return function (input, attribute) {
if (!angular.isObject(input)) return input;
var array = [];
for (var objectKey in input) {
array.push(input[objectKey]);
}
array.sort(function (a, b) {
a = parseInt(a[attribute]);
b = parseInt(b[attribute]);
return a - b;
});
return array;
}
})
.controller('FoobarController', FoobarController);
FoobarController.$inject = ['logger', '$q', 'dataservice', '$stateParams', 'fooBarHandler', '$location', 'satellizer'];
/* #ngInject */
function FoobarController(logger, $q, dataservice, $stateParams, fooBarHandler, $location, $authProvider) {
var vm = this;
fooBarHandler.includeIn(vm, dataservice);
vm.authorize = authorize;
}
}
Problem is that angular keeps saying that satellizer is an unknown provider (Unknown provider: satellizerProvider <- satellizer <- FooBarController)
for the sake of brevity i omitted a lot of code from the controller implementation.
i also tried to wire up the dependency via array dependency like so:
angular
.module('foo.bar', ['satellizer'])
.filter('orderObjectBy', function () {
return function (input, attribute) {
if (!angular.isObject(input)) return input;
var array = [];
for (var objectKey in input) {
array.push(input[objectKey]);
}
array.sort(function (a, b) {
a = parseInt(a[attribute]);
b = parseInt(b[attribute]);
return a - b;
});
return array;
}
})
but still no luck.
Got it working.
After digging trough the source of satellizer i realized i needed to inject from a provider. Satellizer has defined it's provider as '$auth'. So after i changed the line
FooBarController.$inject = ['logger', '$q', 'dataservice', '$stateParams', 'fooBarHandler', '$location', 'satellizer];
to
FooBarController.$inject = ['logger', '$q', 'dataservice', '$stateParams', 'fooBarHandler', '$location', '$auth];
it worked
MY MAIN CONTROLLER
var MyApp = angular.module('ionicApp', ['ionic', 'MobiNav', 'authFactory']);
CONTROLLER CONSUMING FACTORY
MyApp.controller('AuthUser', ['$scope', 'authFactoryService', function ($scope, authFactoryService) {
$scope.showForm = true;
$scope.UserDataLogin = function () {
var loginData = {};
$scope.registration = {
userName: $scope.Auth.userName,
password: $scope.Auth.password,
confirmPassword: $scope.Auth.password
};
authFactoryService.SaveRegistration(registration);
window.scope = loginData;
};
}
]
);
THIS IS THE FACTORY IN SEPERATE FILE
var AuthService = angular.module('authFactory', []);
AuthService.factory('authFactoryService', [
'$http', '$q', '$scope', function ($http, $q, $scope) {
return {
SaveRegistration: function() {
var urlBase = 'http://localhost:48868/';
$http.post(urlBase + 'api/account/register', registration).then(function(response) {
$scope.savedSuccessfully = true;
$scope.message = "User has been registered successfully, you will be redicted to login page in 2 seconds.";
},
function(response) {
var errors = [];
for (var key in response.data.modelState) {
for (var i = 0; i < response.data.modelState[key].length; i++) {
errors.push(response.data.modelState[key][i]);
}
}
$scope.message = "Failed to register user due to:" + errors.join(' ');
});
}
};
}]);
error what i'm getting
Error: [$injector:unpr] http://errors.angularjs.org/1.2.17/$injector/unpr?p0=copeProvider%20%3C-%20%24scope%20%3C-%20authFactoryService
at Error (native)
why it is unable to load authFactoryService service
Finally Figured the dug,
$scope was again injected in Factory
replaced
this
AuthService.factory('authFactoryService', [
'$http', '$q', '$scope', function ($http, $q, $scope) {}]);
to this (just removed the $scope which was again injected in factory for dependency.
AuthService.factory('authFactoryService', [
'$http', '$q', function ($http, $q, $scope) {}]);
var AuthService = angular.module('authFactory', []);
You indlcuded the an empty array in your module. This makes it a
module setter, overwriting an existing module.
to fetch a module you use angular.module('authFactory') <-- note the missing second parameter.
Regards
Sander
Trying to get ngResource to work, but getting the error:
Object # has no method 'query'
I've tried to keep it as simple as possible and according to the documentations/posts that I can find, this should work. But it doesn't.
Here's my service/factory:
var srcServices = angular.module('srcServices', ['ngResource']);
srcServices.factory('Rotation', ['$resource',
function ($resource) {
return $resource('/rotations/:id' );
}]);
And here's the controller code triggering the error:
var srcControllers = angular.module('srcControllers', ['ngResource']);
srcControllers.controller('RotationListCtrl', ['$scope', '$location', 'Rotation', function($scope, Rotation, $location) {
Rotation.query(function(data) {$scope.rotations = data;})
$scope.edit = function(a) {
var path = "/rotations/" + a._id.$oid;
$location.path(path);
};
}]);
Try this
var srcControllers = angular.module('srcControllers', ['ngResource', 'srcServices']);
You are creating the service as a new angular module. So in order to get access to the service you have to inject it to your controller.