user3651267
user3651267

Reputation: 83

Angular routeProvider not working

I am following a basic tutorial to learn Angular Js here

To cut in short i am creating a main page(index.html) and another page(login.html). I wrote the basic html but for instance i`ll share the important lines that effects Angular.

app.js

var app = angular.module("app", []).config(function($routeProvider){
$routeProvider.when('/login', {
    templateUrl: 'login.html',
    controller: 'LoginController'
 });


$routeProvider.otherwise({redirectTo : '/login'});

});

 app.controller('LoginController', function(){
      // To be left blank at the moment.
});

Login.html

<div id="login" class="row">
<div class="large-3 large-offset-3">
    <form>
        <fieldset class="radius">
            <div class="row">
                <div class="large-6 columns">
                    <input type="text" name="username" placeholder="username">
                </div>
                <div class="large-6 columns">
                    <input type="password" name="username" placeholder="password">
                </div>
            </div>
            <div class="row">
                <div class="large-12 columns">
                    <button type="submit" class="button large expand radius">Log In</button>
                </div>
            </div>
        </fieldset>
    </form>
</div>

index.html

<div class="row">
    <div class="large-12">
        <h1> Introduction to Angular Js</h1>
        <div id="view" ng-view></div>
    </div>
</div>

Note: When i try to open localhost/angular it shows me index.html and when i try doing localhost/angular/login it says "404 Not Found"

Upvotes: 0

Views: 71

Answers (2)

Manu
Manu

Reputation: 599

Try accessing the url: localhost/angular/#/login

Upvotes: 1

t0mpl
t0mpl

Reputation: 5025

add the file angular.route.js and this in your module

var app = angular.module("app", ['ngRoute'])

and don't forget it, it can be useful

$routeProvider.otherwise({ redirectTo: '/' });

Upvotes: -1

Related Questions