1

I know there are a lot of questions about the routing not working in AngularJS. I have the same problem and after going through hundreds of answers I decided to post this question yet again. I have three files which are in the root folder in c:\intepub\wwwroot\angular\ and this means I am testing it under IIS. Now my problem is that when I put this URL in the browser: http://localhost/angular/index.html, browser redirects it to: http://localhost/angular/index.html#/ and the text on the page is: Testing routes

However, according to the code, it should go to login.html. And when I put http://localhost/angular/index.html#/test it still shows the same text: Testing routes.

Any ideas?

Thanks

The code is shown below:

index.html

<!DOCTYPE html>
<html ng-app="app">
<head></head>
<body>
    <div>
        Testing routes
        <div ng-view=""></div>
    </div>

    <script src="dep/angular/angular.js"></script>
    <script src="dep/angular/angular-route.js"></script>

    <script>
        var app = angular.module('app', ['ngRoute']);

        app.config(appRouter);

        function appRouter($routeProvider, $locationProvider)
        {
            $routeProvider
                .when('/',
                    {
                        templateURL: 'login.html'
                    })
                .when('/test',
                    {
                        templateURL: 'test.html'
                    })
                .otherwise({tempate: "otherwise"});
        }
    </script>
</body>
</html>

login.html

<div>
    Login Page
</div>

test.html

<div>
    Test page
</div>

3 Answers 3

2

Use templateUrl instead of templateURL

Here are properties for $routeProvider: http://docs.angularjs.org/api/ngRoute/provider/$routeProvider

Here is simply tutorial how to use it: http://docs.angularjs.org/tutorial/step_07

Sign up to request clarification or add additional context in comments.

Comments

0

In the way you've defined your markup:

   <div>
        Testing routes
        <div ng-view=""></div>
    </div>

it will always show "Testing routes" as NG puts view content inside <div ng-view=""> element. You should change it to something suitable.

1 Comment

Even by removing the text it doesn't work. The new markup looks like this: <div><div ng-view=""></div></div>
0

Try this, You have missed controller

function appRouter($routeProvider, $locationProvider)
        {
            $routeProvider
                .when('/',
                    {
                        templateURL: 'login.html',controller: 'loginCtrl'
                    })
                .when('/test',
                    {
                        templateURL: 'test.html',controller: 'testCtrl'
                    })
                .otherwise({tempate: "otherwise"});
        }

login.html

<div ng-controller="loginCtrl">
    Login Page
</div>

Test.html

<div ng-controller="testCtrl">
    Test Page
</div>

Must set the Set as start up page ti index page

enter image description here

Right Click the index.html page in Solution explorer> Click the set as start page option in shown popup.

10 Comments

Tried your suggestion, same problem.
Please set a set as start page in index page, then try it
Can you please elaborate a bit. I didn't get it.
What the page for your default page?
Updated my answer, Pleasee see it mow
|

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.