0
** - Angular JSでは、出力が機能していません。助けてください。 HTMLコードとjsファイルが添付されています。 - ** 以下はAddNewの注文リンクをクリックしたときに以下のコードでAngular JSルーティングが機能していません。 URL
<!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をブラウザのアドレスバーに取り込まなっている私のHTMLコードです。 http://localhost:63022/Sample1.html#!#AddNewOrder
ここに間違っていることをご提案ください。ルーティングはまったく機能していません。
で
または＃/なし： これを試してみてください。 – Hemant
'href'属性の前に'＃ 'を付けないでください。ここの例を参照してください〜https://docs.angularjs.org/api/ngRoute/service/$route#example – Phil
href –