AngularJS DataTables Controller Markup

Question

Recently i have been tweaking this module on angularJS angular-datatables ajax and now i am having this error

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

I just found out that on the markup upong definition of controller in html element there is this "as" keyword after the controller name and it solved my error.

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

Not working Code:

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

Working Code:

<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>

Also i tried this code but it didn't work

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

This is my controller and app 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()
 ];
}]);

• Hadi: do you use $scope in controller or use this?
• lemoncodes: just copied the snippet as instructed in his site.. hard to post the how code.. please refer to the last part of my question.. thanks
• Hadi: OK. when using this instead of $sope in controller then you should use controller as syntax in veiw.
• lemoncodes: uhmm im kinda confused? what do you mean?

Answer 1

when using this instead of $sope in controller then you should use controller as syntax in veiw.

in controller:

 var vm = this;

in view

 ng-controller="ctrl as c"

and also for access scope function or variable using c.dtOptions as you see in your example.