JSFiddle - React, Tailwind, and code Playground

Programmatically changing routes

by oktaviardi pratama

HTML

<script type="text/ng-template" id="page1.htm">
    You're on Page 1
</script>
<script type="text/ng-template" id="page2.htm">
    <p>You're on Page 2</p>
    
     <a href="" ng-click="doSomethingAndChangeRoute()">Do something and change route...</a> 
</script>

<div ng-controller="MyController">
    <a href="#page1">Go to page 1</a>
    <a href="#page2">Go to page 2</a>
    <br/><br/>
    
    <div ng-view></div>
</div>

JavaScript

var myApp = angular.module('myApp', []);

myApp.config(function($routeProvider) {
    $routeProvider.when('/page1', {
        controller: Ctrl1,
        templateUrl: 'page1.htm'
    }).when('/page2', {
        controller: Ctrl2,
        templateUrl: 'page2.htm'
    })
        .otherwise({ redirectTo: '/page1' });
});

function MyController($scope) {
    $scope.doSomethingAndChangeRoute = function() {
        // perform some action here...
        //$route.current = ??
        // 
    }
}

function Ctrl1() {}

function Ctrl2($scope, $location) {
    $scope.doSomethingAndChangeRoute = function() {
        alert('You\'re about to go back to page 1...');
        $location.path('/page1');
    }

}