私はAngularに慣れるためのチュートリアルに従おうとしています。だから、この質問が信じられないほど単純な場合、私は事前に謝罪します。私のindex.html
では、Angularが特定のものを呼び出す方法をテストするために、コントローラの1つを呼び出そうとしています。なぜng-controllerが呼び出されていないのですか?
コードには、<div ng-controller="listCtrl">
があります。しかし、{{3+5}}
という単純なものは評価されておらず、ページにそのまま印刷されています。私はng
属性をいじり試みたと私は
<div ng-app="">
{{3+5}}
</div>
のようなものを持っている場合には、仕事と誰かが(下記掲載)のコードを見てみることができれば、私は思っていた8をプリントアウトし、私に教えてくれます私が間違っていること。
マイindex.html
ファイル:
<!doctype html>
<html lang="en" ng-app="turtleFacts">
<head>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>
<script src="https://code.jquery.com/jquery-2.2.0.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"
integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS"
crossorigin="anonymous"></script>
</head>
<body>
<div class="container">
<div class="page-header">
<h1>Heading</h1>
<h3>Heading3
<strong>QUIZ</strong>
</h3>
</div>
<div ng-controller="listCtrl">
{{dummyData}}
</div>
</div>
<!-- My application scripts -->
<script src="js/app.js"></script>
<script src="js/controllers/list.js"></script>
</body>
</html>
マイlist.js
:
(function(){
angular
.module("turtleFacts")
.controller("listCtrl", ListController);
function ListController($scope) {
$scope.dummyData = "hello world";
}
})
そして、私のapp.js
:
(function() {
angular
.module("turtleFacts", []);
})();
マイフォルダ構造がどのように見えます
Project
|
+-- css
|
+-- js
| |
| +-- controllers
| | |
| | +-- list.js
| |
| +-- app.js
|
+-- index.html
ページには「Hello World」があるはずですが、私が得るのは{{dummyData}}
です。あなたが必要とするかもしれない他の情報があれば教えてください。ありがとう!
すべてのエラーの最後に
();
を追加するのを忘れ?参考までに、jQueryをAngular(推奨しません)と使用する場合は、最初にjQueryをインクルードする必要があります。 – Phil@Phil私は '引数 'listCtrl'は関数ではなく、未定義です.'問題の根源です。それがなぜ呼び出されていないのか分かりません。また、jQuery/Angularのヒントについても感謝します。 – akpersad
私は多分*おそらく、あなたのapp.jsはlist.jsの後で実行していると思います。 '[]'引数を指定すると、その呼び出しはモジュールを消去し、それを再作成します。これにより、コントローラの登録が消去されます。 – Amy