AngularJS – redirect from dynamicaly generated menu

I have problem with redirecting to another pages inside my app. I have dynamicaly generated menu (using devExtreme treeView component). I included angularjs and angular-route, created routing in MainApp.config and every redirect call return 404 error.

Here is my index.html:

<body class="dx-viewport">
<div class="container" ng-app="MainContainer" ng-controller="MainController">
    <div class="left-content">
        <div id="simple-treeview" dx-tree-view="treeViewOptions"></div>
    </div>

    <div class="right-content">
        <div ng-view></div>
    </div>
 </div>

And here is my index.js:

MainApp.config(function ($routeProvider) {
$routeProvider
    .when('/', {
        templateUrl: 'views/blank.html',
        controller: 'MainController'
    })

    .when('/login', {
        templateUrl: 'views/Login.dxview',
        controller: 'LoginController'
    })

    .when('/test', {
        templateUrl: 'views/TestView.dxview',
        controller: 'TestController'
    }); });

MainApp.controller("MainController", function MainController($scope, $window) {
$scope.treeViewOptions = {
    dataSource: treeLoginOption,
    selectionMode: "single",
    selectByClick: true,
    displayExpr: "name",
    keyExpr: "name",
    onItemClick: function (e) {
        var viewType = e.itemData.type;

        if (viewType == "Login") {
            $window.location.href = "login";
            rebuildMenu();
        }
        else
        {
           //
        }   
    }
} });

So the problem here is: When i click on Login at menu, it redirects me to the http://localhost:50073/login and return 404 Error.

How do I propperly include angular routing in Single Page Aplication?

Thanks in advice.

Source: AngularJS