AngularJS - How do I change the State from Inside the Controller

Question

I am new to AngularJS and would like to know how I change the State from within the Controller.

For example, I typically change the state on a button click:

<input type="submit" class="btn btn-lg btn-primary btn-block" value="Log In" ui-sref="main.navigation"/> 

So on Submit of the button, my page will change to the navigation page. This works fine, but what if I want to do some logic in my controller first, and then based off the results, I would want to change to a specific page. How do I do this from within the controller, versus from a button click.

Here is my modules.js in case you are curious:

angular.module('ecsMain', [     'ui.router',     'ui.bootstrap',     'ngTable' ]) .config(['$stateProvider', '$urlRouterProvider', function ($stateProvider, $urlRouterProvider) {     $urlRouterProvider.otherwise('main/login');      $stateProvider         .state('main', {             abstract: true,             url: '',             templateUrl: 'view/main.html'         })         .state('main.login', {             url: '',             controller: ECSMainController,             templateUrl: 'view/login.html'         })         .state('main.phoneCalls', {             url: '',             controller: AccordionDemoCtrl,             templateUrl: 'view/phoneCalls.html'         })         .state('main.navigation', {             url: '',             controller: ModalDemoCtrl,             templateUrl: 'view/navigation.html'         })         .state('main.myModalContent', {             url: '',             controller: ModalDemoCtrl,             templateUrl: 'view/myModalContent.html'         })         .state('main.alertMessage', {             url: '',             controller: ModalDemoCtrl,             templateUrl: 'view/alertMessage.html'         }) }]); 

Thanks

Answer 1

inject $state service to your controller, then in your controller...

CONTROLLER

$scope.changeState = function () {     $state.go('where.ever.you.want.to.go', {stateParamKey: exampleParam}); }; 

and add ng-click to your button

HTML

<button ng-click="changeState()">Change State</button>