javascript - AngularJS 数据表 Controller 标记

Question

最近我一直在 angularJS 上调整这个模块 angular-datatables ajax现在我遇到了这个错误

angular.min.js:117 TypeError: Cannot read property 'aDataSort' of undefined

我刚刚发现在 html 元素中 Controller 定义的标记上， Controller 名称后面有一个“as”关键字，它解决了我的错误。

Now, the question is what is that "as" keyword in that definition and would it be possible not to use it? please refer to the code snippet below

不工作代码:

<div ng-controller="mainCtrl">
    <table datatable="" dt-options="showCase.dtOptions" dt-columns="showCase.dtColumns" class="table table-hover table-bordered table-striped"></table>
</div>

工作代码:

<div ng-controller="mainCtrl as showCase">
    <table datatable="" dt-options="showCase.dtOptions" dt-columns="showCase.dtColumns" class="table table-hover table-bordered table-striped"></table>
</div>

我也尝试了这段代码，但它不起作用

<div ng-controller="mainCtrl">
    <table datatable="" dt-options="dtOptions" dt-columns="dtColumns" class="table table-hover table-bordered table-striped"></table>
</div>

这是我的 Controller 和应用程序 js

var app = angular.module('medrec', ['ngRoute','ngResource','ui.bootstrap','datatables'])
                 .constant('API_URL', window.location.href);

app.controller('mainCtrl',['$scope',
                           'API_URL',
                           'DTOptionsBuilder',
                           'DTColumnBuilder',
                           '$resource',
    function($scope, API_URL, DTOptionsBuilder, DTColumnBuilder, $resource){


        var vm = this;
        vm.dtOptions = DTOptionsBuilder.fromSource(API_URL+'tests/data.json')
            .withPaginationType('simple');
        vm.dtColumns = [
            DTColumnBuilder.newColumn('id').withTitle('ID'),
            DTColumnBuilder.newColumn('firstName').withTitle('First name'),
            DTColumnBuilder.newColumn('lastName').withTitle('Last name').notVisible()
        ];
}]);

Answer 1

当在 Controller 中使用 this 而不是 $sope 时，您应该在 veiw 中使用 controller as 语法。

在 Controller 中:

  var vm = this;

在 View 中

   ng-controller="ctrl as c"

还可以使用 c.dtOptions 访问作用域函数或变量，如示例中所示。