In angular 2+

import RouterModule in module.ts file
import { RouterModule } from '@angular/router';

import router module component.ts file
import { Router } from '@angular/router';

constructor(private router:Router){}
in Angular 16+ for standalone 
import { RouterModule, Router } from '@angular/router';
import { inject } from '@angular/core';

  selector: 'my-router',
  standalone: true,
  imports: [
  templateUrl: './my.component.html',
  styleUrl: './my.component.scss'
private router = inject(Router);

below code can used for angular 2+ and standalone

	//to pass the parameter as slug
	this.router.navigate(['/myRoute', 'myId']); 
	//output will be like this www.https://localhost:4200/myRoute/myId
	//to pass the parameter as query params
	this.router.navigate([ url ], { queryParams: { myId:42 } })
	//output will be like this www.https://localhost:4200/myRoute?myId=42

//for html
in your ts file make it as public
constructor(public router:Router){}
public router = inject(Router);

//normal redirection


//redirection with queryParams


//redirection with slug


For angular js

1. Using $location.path()

The $location service in AngularJS is used to get or set the URL in the browser. To redirect using $location, you can inject the $location service into your controller or component and use the path() method to change the URL.

angular.module('myApp', [])
  .controller('MyController', ['$location', function($location) {

2. Using $window.location

If you want a full page reload during the redirection, you can use the $window service to manipulate the browser’s location.

angular.module('myApp', [])
  .controller('MyController', ['$window', function($window) {
    $window.location.href = '/newPage';

3. Using ngRoute with $location

First, configure your routes in the config block:

angular.module('myApp', ['ngRoute'])
  .config(['$routeProvider', function($routeProvider) {
      .when('/home', {
        templateUrl: 'home.html',
        controller: 'HomeController'
      .when('/newPage', {
        templateUrl: 'newPage.html',
        controller: 'NewPageController'
        redirectTo: '/home'
Then, use $location.path('/newPage') to navigate to the new page:

  .controller('HomeController', ['$scope', '$location', function($scope, $location) {
    $scope.redirectToNewPage = function() {

In your HTML, you can call the redirectToNewPage function:

Support On Demand!