角度1.5コントローラにテキストが表示されない

角度1.5を学習しようとしていますが、コントローラにWebページ上のテキストを表示させるのが難しいです。これは、コントローラにあるものの代わりにevent.nameを表示します。角度1.5コントローラにテキストが表示されない

これはEventDetails.html

<!DOCTYPE html> 
    <html lang="en" ng-app="eventsApp"> 
    <head> 
    <meta charset="utf-8"> 
    <title>Event Registration</title> 
    <link rel="stylesheet" href="/css/bootstrap.min.css"/> 
    <link rel="stylesheet" href="/css/app.css"/> 
    </head> 

    <body> 
    <div class="container"> 
    <div ng-controller="EventController"> 
     {{event.name}} 
    </div> 
    </div> 
    <script scr="/lib/jquery.min.js"/> 
    <script scr="/lib/underscore-1.4.4.min.js"/> 
    <script scr="/lib/boostrap.min.js"/> 
    <script scr="/lib/angular/angular.min.js"/> 
    <script scr="/js/app.js"/> 
    <script scr="/js/controllers/EventController.js"/> 
    </body> 
    </html>

私app.jsお使いのコントローラがあるべき

var eventsApp = angular.module('eventsApp',[]);

EventController

'use strict'; 

eventsApp.controller('EventController', 
function EventController($scope) { 
    $scope.event = { 
     name: 'Angular Boot Camp', 
     time: '10:30 am', 
     date: '1/1/2013' 
     } 

    } 
);

出典

2017-06-11 gkhan

、

eventsApp.controller('EventController', 
function($scope) { 
    $scope.event = { 
     name: 'Angular Boot Camp', 
     time: '10:30 am', 
     date: '1/1/2013' 
     } 

    } 
);

です

DEMO

var eventsApp = angular.module('myApp',[]) 
 
eventsApp.controller('EventController', function($scope){ 
 
    $scope.event = { 
 
     name: 'Angular Boot Camp', 
 
     time: '10:30 am', 
 
     date: '1/1/2013' 
 
     } ; 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.22/angular.min.js"></script> 
 
<body> 
 
    <div ng-app="myApp" ng-controller="EventController"> 
 
    <div class="container">   
 
     <h1> {{event.name}} </h1>  
 
     </div> 
 
    </div> 
 
</body>

出典

2017-06-11 10:54:49 Sajeetharan

私はその解決策を試しても機能しませんでした。早速のお返事ありがとうございます。 – gkhan

@ gkhan何がうまくいかなかったのですか？デモチェックを実行しました – Sajeetharan

角度ブートキャンプの代わりに{{イベント、名前}}ウェブページに表示 – gkhan

あなたの角度アプリが実行されていない理由は、あなたのhtmlのng-app="myApp"宣言を逃しています。

出典

2017-06-12 18:53:52 geofrey

EventDetails.htmlのスクリプトの読み込み順序を逆にしてみてください。

最後に読み込まなければなりません。

右の順序は次のようになります。

<script scr="/js/controllers/EventController.js"/> 
    <script scr="/js/app.js"/>

とあなたはNGアプリ注釈（@geofreyコメント）を追加し、あなたのコントローラ（@Sajeetharanコメント）リファクタリング、同様に他のコメントを採用すべき

出典

2017-08-15 13:53:44

スクリプトタグでは "scr"（ "script scr = ..."ではなく）の代わりに "src"属性を使用してください。

<!DOCTYPE html> 
<html lang="en" ng-app="eventsApp"> 
    <head> 
     <meta charset="utf-8"> 
     <title>Event Registration</title> 
     <link rel="stylesheet" href="/css/bootstrap.min.css"/> 
     <link rel="stylesheet" href="/css/app.css"/> 
    </head> 

    <body> 
     <div class="container"> 
      <div ng-controller="EventController"> 
       {{event.name}} 
      </div> 
     </div> 

     <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.11/angular.min.js"></script> 
     <script> 
      var eventsApp = angular.module('eventsApp',[]); 

      'use strict'; 

      eventsApp.controller('EventController', function EventController($scope) { 
       $scope.event = { 
        name: 'Angular Boot Camp', 
        time: '10:30 am', 
        date: '1/1/2013' 
       } 
      }); 
     </script> 
    </body> 
</html>

出典

2017-08-15 14:37:55

角度1.5コントローラにテキストが表示されない

答えて

関連する問題