I am trying to access $location in my controller and I am not having any luck. Below is my controller code.
bwApp.controller('bidding-controller', [
'$window', '$scope', '$rootScope', '$firebase', '$location',
'$compile', '$interval','$bwAppState', 'bidwrangler_api', 'AuctionService',
'CompanyService', 'NavigationService', 'UserService',
function($window, $scope, $rootScope, $firebase, $location, $compile, $interval,
$bwAppState, bidwrangler_api, AuctionService, CompanyService,
NavigationService, UserService) {
$scope.toggle_auction = function(item) {
if ($bwAppState.user.type == "clerk" && !item.listing) {
$window.location.href = "/clerk/" + item.auction.id + "?item=" + item.id;
}
else {
var restore_pos = null;
if ($location.search().section == 'itmes') {
restore_pos = $('.all-items').scrollTop();
$('.all-items').one('scroll', function(){$('.all-items').scrollTo(restore_pos)});
}
else if ($location.search().section == 'user_items'){
restore_pos = $('#your-items').scrollTop();
$('#your-items').one('scroll', function(){$('#your-items').scrollTo(restore_pos)});
}
NavigationService.update_push_state({item: item.id, section: 'auction'});
}
};
}
]);
When I am checking $location.search().section I keep getting an error in the console. If I am outside of $scope.toggleAuction() I have access to it. I have included/injected it correctly into the controller so I don't understand why I can't access it inside of the $scope function.
The error that I receive looks like the following:
Related
I want to call a service which I defined in DeliverService but when I called it from controller it gives an error of Cannot read propery getRiders of undefined , NO idea why this happened :|
DeliverService.js
angular.module('Deliver')
.service('DeliverService', ['$http', '$state', '$resource', '$q', 'SettingService', '$localStorage', "MessageService", function($http, $state, $resource, $q, SettingService, $localStorage, MessageService) {
var service = {
getRiders : function(){
return $http.get("Hero.json");
//return $http.get(SettingService.baseUrl + "api/orders");
} }
return service;
}]);
DeliverCtrl.js
use strict';
angular.module('Deliver').controller('DeliverCtrl',['$scope','$state', "SettingService","DeliverService", function($scope, $state, $ionicModal, MessageService, SettingService,DeliverService) {
$scope.riders = [];
DeliverService.getRiders().then(function(response){
$scope.riders = response.data.data;
}, function(error){
});
}]);
Your dependencies aren't in the matching order here. Hence, DeliverService isn't actually injected.
Your controller code should look something like this:
angular.module('Deliver').controller('DeliverCtrl',
['$scope','$state', '$ionicModal', 'MessageService', 'SettingService','DeliverService',
function($scope, $state, $ionicModal, MessageService, SettingService, DeliverService) {
$scope.riders = [];
DeliverService.getRiders().then(function(response){
$scope.riders = response.data.data;
}, function(error){});
}]);
In DeliverCtrl.js
The injection Parameter and function parameters do not match
It should be like this
['$scope','$state','$ionicModal','MessageService','SettingService','DeliverService', function($scope, $state, $ionicModal, MessageService, SettingService,DeliverService)
I am having problems injecting ServicesData into SearchCtrl, and keep getting the following error message: Error: [$injector:unpr] Unknown provider: ServicesDataProvider <- ServicesData <- SearchCtrl. What could be the cause of this?
app.js
angular.module('starter', ['ionic', 'jett.ionic.filter.bar', 'starter.controllers'])
.state('app.playlists', {
url: '/playlists',
views: {
'menuContent': {
templateUrl: 'templates/playlists.html',
controller: 'SearchCtrl'
}
}
});
});
controller.js
angular.module('starter.controllers', [])
.controller('AppCtrl', function($scope, $ionicModal, $timeout) {
})
.controller('SearchCtrl', ["$scope", "ServicesData", function($scope, $timeout, ServicesData, $ionicFilterBar) {
// Get list items
function getItems () {
var items = [];
for (var x = 1; x < 3; x++) {
items.push({text: 'Item number ' + x});
}
$scope.items = items;
}
getItems();
// Ionic filter bar
var filterBarInstance;
$scope.visible = true;
$scope.nulledVisible = false;
$scope.toggle = function(event) {
if(event.target.id === 'nulled-search-button' && $scope.nulledVisible === false || event.target.id === 'header-search-button' && $scope.nulledVisible === false) {
$scope.visible = !$scope.visible;
$scope.nulledVisible = true;
}
};
$scope.showFilterBar = function () {
filterBarInstance = $ionicFilterBar.show({
items: $scope.items,
update: function (filteredItems, filterText) {
$scope.items = filteredItems;
if (filterText) {
console.log(filterText);
}
}
});
};
$scope.refreshItems = function () {
if (filterBarInstance) {
filterBarInstance();
filterBarInstance = null;
}
$timeout(function () {
getItems();
$scope.$broadcast('scroll.refreshComplete');
}, 1000);
};
}]);
services.js
angular.module('starter.services', [])
.service("ServicesData", [function () {
var servicesData = [
{
title: 'Car Repair and Maintenance',
total: 7,
id: 1
}
];
return {
getAllServices: function () {
return servicesData;
}
}])
2 things :
fix your controller declaration
["$scope", "ServicesData", function($scope, $timeout, $ionicFilterBar)
["$scope", "ServicesData", "$timeout", "$ionicFilterBar", function($scope, ServicesData, $timeout, $ionicFilterBar)
add dependency to your service module so your controller iwll be able to access what have been declared in your start.services module.
angular.module('starter.controllers', ['starter.services'])
Seems like you have an DI problem. Try to change this:
.controller('SearchCtrl', ["$scope", "ServicesData", function($scope, $timeout, ServicesData, $ionicFilterBar)
to:
.controller('SearchCtrl', ["$scope", "$timeout", "ServicesData", "$ionicFilterBar", function($scope, $timeout, ServicesData, $ionicFilterBar)
Rewrite dependency injection line.
.controller('SearchCtrl', ["$scope","$timeout","ServicesData", $ionicFilterBar, function($scope, $timeout, ServicesData, $ionicFilterBar)
the problem is sequence should be same and you have write dependency in both places.
I'm injecting $filter into my controller and all is well until I try to use it in a promise callback. Here's the gist of the code
controller: ['$scope', '$filter', function($scope, $filter) {
geozipcodes.featured().$promise.then(function(res){
$scope.item = $filter('unique')(res, 'name');
});
}]);
This throws 'Uncaught ReferenceError: $filter is not defined'
However, if I do this
controller: ['$scope', '$filter', function($scope, $filter) {
var $filter = $filter;
geozipcodes.featured().$promise.then(function(res){
$scope.item = $filter('unique')(res, 'name');
});
}]);
Everything works as expected which I don't get at all. I should mention this is inside of an if/else statement, but that shouldn't have any bearing I don't think.
Has anyone experienced anything similar? The way I'm solving it feels really hacky plus I don't really understand why it works.
Update: more code for context
angular.module('ourApp').directive('searchItems', ['$timeout', '$rootScope', 'geozipcodes', 'baselistings', '$compile', '$stateParams',
function($timeout, $rootScope, geozipcodes, baselistings, $compile, $stateParams) {
return {
restrict: "E",
scope: {
performSearch: '&',
emptySetMessage: '#',
itemType: '#',
searchTrigger: '=',
toggleToolbar: '#',
noResults: '=?'
},
templateUrl: 'views/directives/search-items.html',
controller: ['$scope', '$rootScope', 'utils', 'companies', 'settings', 'geozipcodes', '$stateParams', '$filter',
function($scope, $rootScope, utils, companies, settings, geozipcodes, $stateParams, $filter) {
$scope.settings = settings;
$scope.searchType = $scope.itemType == 'student' || $scope.itemType == 'applicant' ? 'student' : $scope.itemType == 'listing' || $scope.itemType == 'application' || $scope.itemType == 'invitation' ? 'listing' : ''
$scope.items = []
$scope.searchInProgress = true;
$scope.initFilters = {};
$scope.pageFilters = {};
$scope.sortList = [];
if ($scope.searchType == 'first') {
// omitted
} else {
if ($scope.itemType == 'listing') {
listingtags.categories().$promise.then(function(res) {
$scope.tagCategories = res;
});
geozipcodes.featured().$promise.then(function(res){
$scope.defaultLocations = $filter('unique')(res, 'name');
});
}
}
...
I am trying to use $rootScope.$watchCollection in my code to update the data in controller B from controller A . but i am not getting any successful in it. as my application got stuck at this point ,so i am seeking your help so that i can came to know that where i am going wrong in code.
Controller B :-
app.controller('MenuCtrl', function($scope, LocalStorage, $stateParams,
$rootScope) {
$scope.user = {};
$scope.user.userName = LocalStorage.getData("userName");
$scope.user.profilePic = LocalStorage.getData("userProfile");
$rootScope.$watchCollection(function(n, o) {
if (n !== o) {
var list = $rootScope.wholecartList;
alert("Length " + list.length);
}
});
});
Controller A :-
app.controller('ProductCtrl', function($http, $scope, $ionicPopup, $state,
$ionicHistory, $ionicLoading, DataService, LocalStorage, $stateParams,
ProductId, DuplicateCheck, $rootScope) {
$scope.productList = DataService.getProducts();
$scope.getProductId = function(productId) {
ProductId.addProductId(productId);
$state.go("app.products-details");
}
var cartList = [];
$scope.cartListItems = function(product) {
if (cartList.length > 0) {
if (!DuplicateCheck.getProducts(product.product_id, cartList)) {
cartList.push(product);
}
} else {
cartList.push(product);
}
$rootScope.wholecartList = cartList;
}
});
Any help will be greatly appreciated
Thanks.
After this you need to update the $rootScope (say, run the apply cycle);
app.controller('ProductCtrl', function($http, $scope, $ionicPopup, $state,
$ionicHistory, $ionicLoading, DataService, LocalStorage, $stateParams,
ProductId, DuplicateCheck, $rootScope) {
$scope.productList = DataService.getProducts();
$scope.getProductId = function(productId) {
ProductId.addProductId(productId);
$state.go("app.products-details");
}
var cartList = [];
$scope.cartListItems = function(product) {
if (cartList.length > 0) {
if (!DuplicateCheck.getProducts(product.product_id, cartList)) {
cartList.push(product);
}
} else {
cartList.push(product);
}
$rootScope.wholecartList = cartList;
updateRootScope();
}
function updateRootScope(){
if(!$rootScope.$$phase){
$rootScope.$apply();
}
}
});
Project Architecture:
-> public/modules/core/services/home.client.service.js
-> public/modules/core/controllers/home.client.controller.js
-> public/modules/core/controllers/header.client.controller.js
-> public/modules/core/views/header.client.view.html
-> public/modules/core/views/home.client.view.html
I am trying to inject home.client.service into home.client.controller.js
The following code:
angular.module('core').controller('HomeController', ['$scope', 'Authentication', 'HomeService',
function($scope, $q, Authentication, HomeService) {
Returns:
Unknown provider: HomeServiceProvider <- HomeService
Whereas:
angular.module('core',[]).controller('HomeController', ['$scope', 'Authentication', 'HomeService',
function($scope, $q, Authentication, HomeService) {
Returns:
Argument 'HeaderController' is not a function, got undefined
header.client.controller.js looks like:
'use strict';
angular.module('core').controller('HeaderController', ['$scope', 'Authentication', 'Menus',
function($scope, Authentication, Menus) {
$scope.authentication = Authentication;
$scope.isCollapsed = false;
$scope.menu = Menus.getMenu('topbar');
$scope.toggleCollapsibleMenu = function() {
$scope.isCollapsed = !$scope.isCollapsed;
};
// Collapsing the menu after navigation
$scope.$on('$stateChangeSuccess', function() {
$scope.isCollapsed = false;
});
}
]);
home.client.service is:
angular.module('core').service('HomeService', function($http) {
function get(n,idc,cluster,type){
//Return a promise
return $http.post('url/search?idc=' + idc + '&type=' + type + 'cluster=' + cluster , n);
}
return {
get: get
}
});
Can anyone help me correctly inject my service into my controller?
You need the string '$q' in your array as well.
Like this:
angular.module('core').controller('HomeController',
['$scope', '$q', 'Authentication', 'HomeService',
function($scope, $q, Authentication, HomeService) {