** -- 路由在 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:\Dev\WebApplication1\WebApplication1\Scripts/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>
或者根本没有#/
关于javascript - Angular JS 路由不适用于以下代码。网址,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42335933/