We Keep Coding

Two Controller Loading on ng-click function in angular?

I am navigating to profile page which has profileCtrl and ng-click function is in hmplController, When I click on ng-click both controller will load I mean hmplController and profileCtrl, This will happen only first time. After clearing cache again on ng-click both controller.
Here is my code.
homepal.controller('hmplController', function ($scope, $cookies,$mdSidenav) {
$scope.profile=function(){
$location.path("/profile/index");
}
$scope.myShortlists=function(){
$location.path("/profile/myShortlists");
}
$scope.recentlyViewed=function(){
$location.path("/profile/recentlyViewed");
}
$scope.enquiredProperties=function(){
$location.path("/profile/enquiredProperties");
}
$scope.accountSettings=function(){
$location.path("/profile/accountSettings");
}
});
My routeProvider as below
sidemenu.config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) {
$routeProvider
.when('/profile/index', {
templateUrl: '../view/profile.html',
controller: 'profileCtrl'
})
.when('/propCountry/:cityName',{
templateUrl: '../view/propertyInCity.html',
controller: 'cityController'
})
.when('/profile/myShortlists',{
templateUrl: '../template/myshortlist.html',
controller: 'profileCtrl'
})
.when('/profile/recentlyViewed',{
templateUrl: '../template/recentlyViewed.html',
controller: 'profileCtrl'
})
.when('/profile/enquiredProperties',{
templateUrl: '../template/EnqProperties.html',
controller: 'profileCtrl'
})
.when('/profile/accountSettings',{
templateUrl: '../template/AccSettings.html',
controller: 'profileCtrl'
})
.when('/builders/:id', {
templateUrl: '../template/listpagefilter.html',
controller: 'buildersCtrl'
})
.when('/builders/:id/property/:property_id', {
templateUrl: '../view/property-details.html',
controller: 'unitTypeCtrl'
})
.when('/property/:property_id', {
templateUrl: '../view/property-details.html',
controller: 'unitTypeCtrl'
})
.when('/location/:city_name/:location_id', {
templateUrl: '../template/listpagefilter.html',
controller: 'buildersCtrl'
})
.when('/:city_id', {
templateUrl: '../template/listpagefilter.html',
controller: 'buildersCtrl'
})
.when('/sublocation/:sub_location_id', {
templateUrl: '../template/listpagefilter.html',
controller: 'buildersCtrl'
})
.when('/nearby/:neighbourhood_id',{
templateUrl: '../template/listpagefilter.html',
controller: 'buildersCtrl'
})
.when('/filterate/:query',{
templateUrl: '../template/listpagefilter.html',
controller: 'buildersCtrl'
})
.when('/quicklinks/homeloan', {
templateUrl: '../view/homeloan.html',
controller: 'profileCtrl'
})
.when('/quicklinks/docHome', {
templateUrl: '../view/quickdoc.html',
controller: 'profileCtrl'
})
.when('/quicklinks/emiCal', {
templateUrl: '../view/emiCalculator.html',
controller: 'profileCtrl'
})
.when('/quicklinks/buyingSteps', {
templateUrl: '../view/property_buying.html',
controller: 'profileCtrl'
})
.when('/quicklinks/vaastuTips', {
templateUrl: '../view/vaastu.html',
controller: 'profileCtrl'
})
.when('/quicklinks/nriService', {
templateUrl: '../view/nri.html',
controller: 'profileCtrl'
})
.when('/quicklinks/homepalmedia', {
templateUrl: '../view/homepal_media.html',
controller: 'profileCtrl'
})
.when('/quicklinks/aboutus', {
templateUrl: '../view/homepal_aboutus.html',
controller: 'profileCtrl'
})
.when('/quicklinks/homebuilders', {
templateUrl: '../view/homepal_builders.html',
controller: 'profileCtrl'
})
.when('/quicklinks/services', {
templateUrl: '../view/homepal_ourservices.html',
controller: 'profileCtrl'
})
.when('/quicklinks/contact', {
templateUrl: '../view/homepal_contactus.html',
controller: 'profileCtrl'
})
}])
Profile Controller
sidemenu.controller('profileCtrl', ['$scope', '$rootScope', '$location', '$http',
'allServices', '$document', 'PropertyDetails', '$routeParams', '$window', '$location',
'$anchorScroll', 'customVariables','$mdDialog','raisedEnquiryDetails','$anchorScroll', function(a, b, c, d, e, f, h, r, w, l, s, cust,v,rse,scrl) {
e.getProjectwishlist().then(function(result) {
alert(JSON.stringify(result));
}, function(error) {
alert("error");
});
var srchCls_Element = angular.element(document.querySelector('.navbar-affixed-top'));
if (srchCls_Element) {
srchCls_Element.addClass('listing-navbar');
}
a.$on('$routeChangeStart', function(scope, next, current) {
b.homepage = true;
b.filter = false;
b.innerHeader = "";
b.searchFilter = false;
srchCls_Element.removeClass('listing-navbar');
});
a.homeloan=function(){
c.path('/quicklinks/homeloan');
}
a.docHome=function(){
c.path('/quicklinks/docHome');
}
}]);

Routing in Angular

How can I organize the following code in a way that I can only get template.html and not the template1.html?
App.config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) {
$locationProvider.html5Mode({
enabled: true,
requireBase: false
});
$routeProvider
.when('/', {
templateUrl: "template/home.html",
controller: "homeCtrl"
})
.when('/artist', {
templateUrl: "template/artist.html",
controller: "artistCtrl"
})
.when('/:collectionId', {
templateUrl: "template/template.html",
controller: "templateCtrl"
})
.when('/:trackId', {
templateUrl: "template/template1.html",
controller: "templateCtrl"
})
.otherwise({
redirectTo: "/"
});
}]);
Thank you for your help!

You should rename your routes.
.when('/collection:id', {
templateUrl: 'your/template.html',
controller: 'yourController'
});
})

controller not a function AngularJS

I have a problem. my routes do not find my controllers except /vehicules
app.js
angular.module('myApp', ['ngRoute', 'ui.grid']);
angular.module('myApp').config(function($routeProvider) {
$routeProvider
// route for the home page
.when('/', {
templateUrl: 'views/main.html',
controller: ''
})
.when('/vehicules', {
templateUrl: 'views/vehicules.html',
controller: 'VehiculeCtrl'
})
.when('/vehicule/:id', {
templateUrl: 'views/vehicule.html',
controller: 'VoirVehiculeCtrl'
})
.when('/agents', {
templateUrl: 'views/agents.html',
controller: 'AgentsCtrl'
})
.when('/agences', {
templateUrl: 'views/agences.html',
controller: 'AgencesCtrl'
})
.when('/status', {
templateUrl: 'views/status.html',
controller: 'StatusCtrl'
})
.otherwise({
redirectTo: '/'
});
});
VoirVehiculeCtrl.js
angular.module('myApp').controller('VoirVehiculeCtrl', function($scope) {});
my tree:
Javascript
controllers
VehiculeCtrl.js
VoirVehiculeCtrl.js
App.js
Views
please help me !! and sorry for my english xD

How to test routing with AngularJS and Karma

My routing looks like:
angular.module('mean').config(['$routeProvider', '$translateProvider', '$locationProvider',
function($routeProvider, $translateProvider, $locationProvider) {
$routeProvider.
when('/items', {
templateUrl: '/views/main.html',
controller: 'ItemsController'
}).
when('/items/create', {
templateUrl: '/views/main.html',
controller: 'ItemsController'
}).
when('/articles/create', {
templateUrl: 'views/articles/create.html'
}).
when('/articles/:articleId/edit', {
templateUrl: 'views/articles/edit.html'
}).
when('/articles/:articleId', {
templateUrl: 'views/articles/view.html'
}).
when('/', {
templateUrl: '/views/index.html'
}).
otherwise({
redirectTo: '/'
});
$locationProvider.html5Mode(true);
$translateProvider.useStaticFilesLoader({
prefix: '/lang/',
suffix: '.json'
});
$translateProvider.fallbackLanguage('en-US');
$translateProvider.useCookieStorage();
$translateProvider.preferredLanguage('en-US');
}
]);
Basically, I want to write tests to ensure that every route has a template and a controller.

You shouldn't need to test that routing works, the angular codebase already does, for some useful tests you could look at this example:
AngularJS Test Controller Containing routeChangeSuccess

Having trouble with Angular.js routes

below is what my app.js and controllers.js files look like:
angular.module('RayAuth', ['RayAuth.filters', 'RayAuth.services', 'RayAuth.directives']).
config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) {
$routeProvider.
when('/', {
templateUrl: 'partials/index.html',
controller: IndexCtrl
}).
when('/users', {
templateUrl: 'partials/users.html',
controller: UserCtrl
}).
when('/controlpanel', {
templateUrl: 'partials/controlpanel.html',
controller: ControlCtrl
}).
when('/modules/', {
templateUrl: 'partials/modules.html',
controller: ModuleCtrl
}).
when('/resources/', {
templateUrl: 'partials/resources.html',
controller: ResourceCtrl
}).
when('/privileges/', {
templateUrl: 'partials/privileges.html',
controller: PrivilegeCtrl
}).
when('/roles/', {
templateUrl: 'partials/roles.html',
controller: RoleCtrl
}).
when('/userroles/', {
templateUrl: 'partials/userroles.html',
controller: UserRoleCtrl
}).
otherwise({
redirectTo: '/'
});
$locationProvider.html5Mode(true);
}]);
and this is my controllers.js:
'use strict';
function IndexCtrl() {
IndexCtrl.$inject = [];
}
function UserCtrl() {
UserCtrl.$inject = [];
}
function ControlCtrl() {
ControlCtrl.$inject = [];
}
function ModuleCtrl() {
ModuleCtrl.$inject = [];
}
function ResourceCtrl() {
ResourceCtrl.$inject = [];
}
function PrivilegeCtrl() {
PrivilegeCtrl.$inject = [];
}
function RoleCtrl() {
RoleCtrl.$inject = [];
}
function UserRoleCtrl() {
UserRoleCtrl.$inject = [];
}
i have added the ng-app and ng-view to my index file but when i load it in the browser it keeps redirecting to http://localhost/ instead of http://localhost/ray-auth/ what am i doing wrong here? can anybody help?

Try this :
angular.module('RayAuth', ['RayAuth.filters', 'RayAuth.services', 'RayAuth.directives']).
config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) {
$routeProvider.
when('/', {
templateUrl: 'partials/index.html',
controller: IndexCtrl
}).
when('/users', {
templateUrl: 'partials/users.html',
controller: UserCtrl
}).
when('/controlpanel', {
templateUrl: 'partials/controlpanel.html',
controller: ControlCtrl
}).
when('/modules/', {
templateUrl: 'partials/modules.html',
controller: ModuleCtrl
}).
when('/resources/', {
templateUrl: 'partials/resources.html',
controller: ResourceCtrl
}).
when('/privileges/', {
templateUrl: 'partials/privileges.html',
controller: PrivilegeCtrl
}).
when('/roles/', {
templateUrl: 'partials/roles.html',
controller: RoleCtrl
}).
when('/userroles/', {
templateUrl: 'partials/userroles.html',
controller: UserRoleCtrl
});
$locationProvider.html5Mode(true);
}]);
I have removed the otherwise , which actually tells it to redirect to '/' in all other cases.
Also on a side note,
function PrivilegeCtrl() {
}
PrivilegeCtrl.$inject = [];
As shown above, the inject should be done outside the controller.

Maybe
<!doctype html>
<html lang="en" ng-app="RayAuth">