0
私はAngularJSを使用して非常に簡単なウェブサイトで練習しています。私はコントローラを動作させるようにしましたが、今はルーティングを実装しています。シンプルで、私はCodecademy.comで何度もやったことがありますが、今回はhome.htmlコードが画面に表示されません。フォルダ構造と完全なコードはhereです。多分誰かが問題を知っているでしょうか？AngularJSルーティングの問題：ホームページが表示されない
私のindex.htmlは;
<!DOCTYPE html>
<html>
<head>
<title>EventsApp</title>
<link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="css/main.css">
<link href='https://fonts.googleapis.com/css?family=Roboto:300,400,700' rel='stylesheet' type='text/css'>
<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.min.js"></script>
</head>
<body ng-app="EventsApp" ng-controller="HomeController" >
<header class="container">
<div class="row">
<h1 class="col-sm-8">EventsApp</h1>
</div>
</header>
<section class="jumbotron">
</section>
<h1> {{test}} </h1>
<div ng-view></div>
<!-- Modules -->
<script type="text/javascript" src="js/app.js"></script>
<!-- Controllers -->
<script type="text/javascript" src="js/controllers/HomeController.js"></script>
<!-- Services -->
</body>
</html>
app.jsファイル：
var app = angular.module("EventsApp", ['ngRoute']);
app.config(function ($routeProvider) {
$routeProvider
.when('/', {
controller: 'HomeController',
templateUrl: 'views/home.html'
})
.otherwise({
redirectTo: '/'
});
});
HomeController.js：
app.controller('HomeController', ['$scope',
function($scope) {
$scope.test="Success";
}]);
とhome.html：
<h1> {{test}} </h1>
<section class="container">
<h1> {{test}} </h1>
<div class="col-sm-4">
<div class="card">
<img class="img-responsive" src="https://s3.amazonaws.com/codecademy-content/projects/red-eye-photography/p1.jpg" />
<div class="block">
<h4 class="card-title">Card title</h4>
<p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
<a href="#" class="btn btn-primary">Go somewhere</a>
</div>
</div>
</div>
<div class="col-sm-4">
<div class="card">
<img class="card-img-top" src="..." >
<div class="block">
<h4 class="card-title">Card title</h4>
<p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
<a href="#" class="btn btn-primary">Go somewhere</a>
</div>
</div>
</div>
</section>
興味深いことに、これは私がモジュールとコントローラをインポートする方法を教えてくれたわけではありませんが、まだ動作していません...（コントローラが動作していることを確認するためにng-controller = "HomeController"それに問題はないこと） –