Angular JS路由无法处理以下代码.URL

** - 路由在Angular JS上不起作用。请帮忙。附加了HTML代码和JS文件。 - ** 下面是我的HTML代码

<!DOCTYPE html>
<html>
<head>
    <title>AngularJS Routing Examples</title>
    <meta charset="utf-8" />
    <link href="Content/bootstrap.css" rel="stylesheet" />
</head>
<body ng-app="sampleApp">
    <div class="container">
        <div class="row">
            <div class="col-md-3">
                <ul class="nav"> 
                    <li>
                        <a href="#AddNewOrder">Add New Order</a>
                    </li>
                    <li>
                        <a href="#ShowOrder">Show Orders</a>
                    </li>
                </ul>
            </div>
            <div class="col-md-9">
                <div ng-view>
                </div>
            </div>
        </div>
    </div>
    <script src="Scripts/angular.js"></script>
    <script src="Scripts/angular-route.js"></script>
    <script src="script/app.js"></script>
</body>
</html>

/// <reference path="C:DevWebApplication1WebApplication1Scripts/angular.js" />
var sampleApp = angular.module('sampleApp', ['ngRoute']);
//Define Routing 
sampleApp.config(function ($routeProvider) {
    $routeProvider.when('/AddNewOrder', {
        templateUrl: 'templates/AddNewOrder.html',
        controller: 'AddOrderController'
    }).when('/ShowOrder', {
        templateUrl: 'templates/ShowOrder.html',
        controller: 'ShowOrderController'
    });
});
sampleApp.controller('AddOrderController', function ($scope) {
    $scope.message = "This is Add Order screen";
});
sampleApp.controller('ShowOrderController', function ($scope) {
    $scope.message = "This is show Order screen";
});

单击添加订单链接时，错误的URL在浏览器地址栏上填充。http：//localhost：63022/sample1.html＃！#addneworder

请建议这里有什么问题。路由根本不起作用。

您的链接是错误的。尝试以下操作：

            <li>
                <a href="#/AddNewOrder">Add New Order</a>
            </li>
            <li>
                <a href="#/ShowOrder">Show Orders</a>
            </li>

或没有＃/根本没有

相关内容

最新更新

热门标签：