2016-07-07 8 views
1

タブにデータを取得しようとしています。AngularJSデータがng-route経由でロードされない

app.config(['$routeProvider', function($routeProvider){ 
$routeProvider 
    .when('/EventList',{ 
     templateUrl:'html/eventsList.html', 
     controller: 'eventListController', 
     controllerAs:'eventListCrtl' 
      }) 
    .otherwise({redirectTo:'/'}); 
}]); 

私は、コントローラは、ここでcontrollerAs

と私のテンプレートの内側にありますコントローラと名前が私のコントローラのコードで、ここで定義します:

私のアプリケーションは、私の設定コードであるので、ここで、NG-ルートを使用しています
app.controller('eventListController',['$scope', 'EventListHolder', function($scope, EventListHolder){ 
    var eventList = EventListHolder.get(); 
    window.alert(eventList.eventHead[1].numeroDossier); 

}]); 

工場からデータを取得します。 window.alertが機能するので、データはコントローラにロードされます。

しかし、私のテンプレートでは、HTMLテーブルにeventHeadテーブルを表示しようとしています。ここ はHTMLです:

<div align="center"> 
      <div class="container-fluid"> 
       <header> 
        <h1>Event List</h1> 
       </header> 
      </div> 

      <table class="row-spacer40 table-fill" > 
       <thead> 
        <tr> 

         <th class="text-left">Numero</th> 
         <th class="text-left">Dossier/Client</th> 
         <th class="text-left">Lieu</th> 


        </tr> 
       </thead> 

       <tr ng-repeat="event in eventListCrtl.eventList.eventHead"> 
        <td> <a href="/EventDetail">{{event.numeroDossier}}</a> 
        </td> 
        <td>{{event.designationDossier}}<br>{{event.nomClient}} 
        </td> 
        <td>{{event.adresse}} 
        </td> 
       </tr> 
      </table> 
</div> 

は私が一望できていますngのルートに固有のものはありますか?

PS:役立つ場合は、ここにデータが含まれているJSONがあります。 (あなたは私のデータ構造の明確な定義が必要な場合。)

{ 
"eventHead": [ 
    { 
     "numeroDossier": 96549, 
     "designationDossier": "TECHNIQUE MARIAGE ", 
     "nomClient": "Olivia John & Donovan Hamlet", 
     "adresse": "ABBAYE DES VAUX DE CERNAY" 
    }, 
    { 
     "numeroDossier": 98986, 
     "designationDossier": "TOURNEE FDJ OLA", 
     "nomClient": "LA FRANCAISE DES JEUX", 
     "adresse": "MAGNUM" 
    } 
], 
"success": true 
    } 
+0

this.eventList = EventListHolder.get(); – varit05

答えて

0

代わりのvar eventListの

this.eventList = EventListHolder.get(); 

を使用する必要があります。 ControllerAs構文は、あなたのビューモデルが$ scopeの代わりに 'this'オブジェクトにバインドされることを期待しています。

+0

トリックをしてくれてありがとう! –

関連する問題