stateprovider is not working in switching pages - angularjs

Question

In my program i want to load programsetup html page after pressing sign in button in login page.
myconfig function for login pages as follows
.config(function config($stateProvider) {
$stateProvider.state('login', {
url: '/login',
views: {
"main": {
controller: 'LoginCtrl',
templateUrl: 'login/login.tpl.html'
}
},
data: {
pageTitle: 'Login'
}
});
})
login page loads successfully! but program setup page is not loading after click on sign in button
$location.href = "#/programsetup";
this is line i used in my login .js for loading program setup page my programsetup config function is:
.config(function config($stateProvider) {
$stateProvider.state('programsetup', {
url: '/programsetup',
views: {
"main": {
controller: 'ProgramSetupCtrl',
templateUrl: 'programsetup/programsetup.tpl.html'
}
},
data: {
pageTitle: 'Program Setup'
}
});
})
what mistake i am doing? please help me out.

Answer 1

In your login.js file(inside login controller) you need to write ng-click method and add below code
$state.go("programsetup");
And $state need to add dependency injection in your controller

Answer 2

Just configure your state for programsetup inside the root .config. Then for the button login. User $state.go('programsetup') to go to that page.
Rough Html:
<button class="button button-positive" ng-click="login()">Go Programsetup</button>
Then in the config and controller.
.config(function config($stateProvider) {
$stateProvider.state('login', {
url: '/login',
views: {
"main": {
controller: 'LoginCtrl',
templateUrl: 'login/login.tpl.html'
}
},
data: {
pageTitle: 'Login'
}
});
$stateProvider.state('programsetup', {
url: '/programsetup',
views: {
"main": {
controller: 'ProgramSetupCtrl',
templateUrl: 'programsetup/programsetup.tpl.html'
}
},
data: {
pageTitle: 'Program Setup'
}
});
})
.controller('LoginCtrl', function($scope, $state) {
$scope.login = function() {
$state.go('programsetup');
}
})
.controller('ProgramSetupCtrl', function($scope) {
alert('i am at Program setup page.');
})