AngularJS 数据不会通过 ng-route 加载

Question

我正在尝试将一些数据放入选项卡中。我的应用程序使用 ng-route，所以这是我的配置代码：

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

我在这里定义了控制器以及控制器将在我的模板中使用 controllerAs 的名称

这是我的控制器代码：

app.controller('eventListController',['$scope', 'EventListHolder', function($scope, EventListHolder){
    var eventList = EventListHolder.get();
    window.alert(eventList.eventHead[1].numeroDossier);

}]);

它从工厂检索数据。由于 window.alert 工作，数据被加载到控制器中。

但由于某些原因，它没有出现在我的模板中，我试图在其中显示 eventHead table HTML table。这是 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-route 的内容？

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
  }

Answer 1

你应该使用

this.eventList = EventListHolder.get();

而不是 var eventList。 ControllerAs 语法期望您的视图模型绑定到 'this' 对象而不是 $scope.

AngularJS 数据不会通过 ng-route 加载

AngularJS data will not load through ng-route

html

javascript

router

angularjs