AngularJs路由无法正常工作

时间:2013-09-11 09:44:50

标签: angularjs

我正在尝试为角度路由设计一个简单的示例,但它不起作用(当我浏览根目录时,它没有被重定向到我期望的页面)

HTML

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head data-ng-app="MyApp">
    <title></title>
    <script src="Scripts/routing.js"></script>
</head>
<body>
   Hello

    <ng-view></ng-view>
     <script src="Scripts/angular.js"></script>
</body>
</html>

JAVASCRIPT(routing.js)

/// <reference path="angular.js" />

var MyApp = angular.module('MyApp', [])

.config(function ($routeProvider, $locationProvider) {

    $locationProvider.html5Mode(true);

    $routeProvider.when('/', { templateUrl: '/Templates/dashboard.html',controller:'Mycontroller' })

    .otherwise({redirectTo :'/Templates/otherwise.html'})

});

function Mycontroller() {

}

我从Visual Studio运行它,并且浏览器中的根URL是localhost:3669 /并且根据我的角度路由我希望这显示dashboard.html但它不是并且只显示主html页面(我粘贴的代码)

对此的任何帮助将不胜感激

2 个答案:

答案 0 :(得分:4)

您正在Angular之前运行代码!将<script>与您的代码放在Angular的<script>之后。

答案 1 :(得分:2)

请从'/Templates/dashboard.html'中删除'/',只需使用Templates / dashboard.html

$routeProvider.when('/', { templateUrl: 'Templates/dashboard.html',controller:'Mycontroller' })

.otherwise({redirectTo :'Templates/otherwise.html'})