2016-06-12 8 views
3

本当に基本的な質問:コントローラを追加しようとするまでAngularの動作を開始する「hello world」アプリ。その時点では式がページ上で動作しない。角度のある "Hello World"アプリケーションを初期化する

<!doctype html> 
<html ng-app='app'> 
<head> 
<link rel='stylesheet' href='css/styles.css'> 
<link rel='stylesheet' href='css/bootstrap.min.css'> 
<script src='js/app.js'></script> 
<script src='js/angular.min.js'></script> 
</head> 
<body> 
<div class='container col-md-6 col-md-offset-6 panel' ng-controller='FormController'> 
    <input type='text' ng-model='name' placeholder='Enter your name'> 
    <h1>Hello {{name}}</h1> 
</div> 

</body> 
</html> 

JS:。

angular.module('app', []).controller('FormController', function($scope){ 
$scope.name = 'Test'; 
}); 

ページがちょうど{{name}を}表示して終わるが、私は、コントローラと「アプリ」モジュールを取るならば、それだけで正常に動作ヘルプは素晴らしいことだ、あなたに感謝

答えて

6

jsファイルを含んでいます。

<script src='js/angular.min.js'></script> 
<script src='js/app.js'></script> 
+0

どうもありがとう、。私はあなたにこのような簡単な質問に答えていただきありがとうございます! – MoSheikh

+0

@MoSheikhあなたがSSHの答えを受け入れるべきであるならば、それは "トリックをした" – deltree

0

ワーキングコードのトリックをやったここ

<!doctype html> 
<html ng-app='app'> 
<head> 
<script src = "http://www.ptutorial.com/angularjs/ 
angular.min.js"></script> 
<link rel="stylesheet" href="http://freeonlinecompiler.ptutorial.com/ 
css/bootstrap.min.css"> 
    </head> 
<body> 
<div class='container col-md-6 col-md-offset-6 panel' ng-controller='FormController'> 
    <input type='text' ng-model='name' placeholder='Enter your name'> 
    <h1>Hello {{name}}</h1> 
</div> 
<script> 
    angular.module('app', []).controller('FormController', function($scope){ 
$scope.name = 'Test'; 
}); 
    </script> 
</body> 
</html>