Hello Angular

Angular Tutorial 01 - route with Html5Mode

by Sean Xu

HTML

<div ng-app="eventsApp">
    
    <div ng-controller="EditEventController">{{helloMessage}}</div>
    <a href="/view1">view1</a>
    <a href="/view2">view2</a>
    <ng-view></ng-view>
</div>

JavaScript

var eventsApp = angular.module('eventsApp',[])
.config(function($routeProvider,$locationProvider){
    $routeProvider
       .when('/view1',{
            template:'<div>{{message}}</div>',
            controller: function($scope){
                $scope.message='this is view1';
            }
        })
       .when('/view2',{
            template:'<div>{{message}}</div>',
            controller: function($scope){
                $scope.message='this is view2';
            }
        });
    $locationProvider.html5Mode(true);
})
.controller('EditEventController', function($scope){
        $scope.helloMessage = 'Hello world';
    });