ルーティング:AngularJS:だから私は角tutoを見ていたし、男は「ngRoute」を説明し、どのようにそれを使用するには、この例を使用していた
var myApp = angular.module('myApp', ['ngRoute']);
myApp.config(function ($routeProvider) {
$routeProvider
.when('/', {
templateUrl: 'pages/home.html',
controller: 'mainController'
})
.when('/second', {
templateUrl: 'pages/second.html',
controller: 'secondController'
})
});
myApp.controller('mainController', ['$scope', '$route', function ($scope, $route) {
}])
.controller('secondController', ['$scope', '$route', function ($scope, $route) {
}]);
<!DOCTYPE html>
<html lang="en" ng-app="myApp">
<head>
<meta charset="UTF-8">
<title>Document</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" type="text/css">
</head>
<body>
<!-- Fixed navbar -->
<nav class="navbar navbar-default navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<a class="navbar-brand" href="#">Angular</a>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav navbar-right">
<li><a href="#">Home</a></li>
<li><a href="#/second">Second</a></li>
</ul>
</div>
</div>
</nav>
<div class="container">
<div ng-view class="jumbotron"></div>
</div> <!-- /container -->
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.3/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.3/angular-route.js"></script>
<script src="app.js"></script>
</body>
</html>
、それは彼のために働いていましたしかし、私にとっては、ホームリンクだけが働いていたが、<a href="#/second">Second</a>
を<a href="#!/second">Second</a>
に変更してもうまくいかなかったのはなぜですか?
あなたが使用していたバージョンのためです。あなたが視聴したビデオは、角度1.4または1.5で表示される可能性があります。 ngRouteと一緒に行けない、ngRouteよりも柔軟なui-routerを試してください –
はい、私の友人もそう言いました! ありがとうございます – damer