Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Can Angular-UI-Grid-Edit be used with "controller as" syntax?

I've written my entire Angular app managing to avoid the use of $scope, using the "controller as" syntax instead, to help ease the transition to Angular 2.0 and because I believe this is the more current practice.

But I can't figure out how to avoid using $scope with ui-grid's gridApi.edit.on.afterCellEdit event, which is documented as follows:

gridApi.edit.on.afterCellEdit(scope,function(rowEntity, colDef){})

Parameters

rowEntity – {object} – the options.data element that was edited
colDef – {object} – the column that was edited
newValue – {object} – new value
oldValue – {object} – old value

Based on the documentation I have done this, which works (after injecting $scope into the controller):

ctrl.tableOptions.onRegisterApi = function(gridApi){
  ctrl.gridApi = gridApi;
  gridApi.edit.on.afterCellEdit( $scope, function(rowEntity,colDef, newValue, oldValue) {
    //save stuff here 
  });
};

but as you can see I had to use $scope in the event's callback, otherwise I get an error telling me scope.$on is not a function. Is it possible to NOT use $scope? I tried "this" but it only seems to want $scope.

Obviously, I don't really understand what I am doing, and I can't find much documentation on afterCellEdit other than this and the example which I slavishly followed above, so I am turning to you for help. Thousands of lines of $scope-free code, it seems like a shame to fall at the last hurdle!

thanks in advance

John

like image 256
John Avatar asked Mar 18 '15 04:03

John


People also ask

What is the responsibility of the controller in AngularJS?

The primary responsibility of the controller is to create a scope object and thereby pass it to the view. With this, we come to an end of this AngularJS Controllers article.

Which directive is used for controller in Angular?

AngularJS ng-controller Directive The ng-controller directive adds a controller to your application. In the controller you can write code, and make functions and variables, which will be parts of an object, available inside the current HTML element. In AngularJS this object is called a scope.

Does Angular have controller?

AngularJS ControllersAngularJS applications are controlled by controllers. The ng-controller directive defines the application controller. A controller is a JavaScript Object, created by a standard JavaScript object constructor.

What is $state in AngularJS?

$stateProvider is used to define different states of one route. You can give the state a name, different controller, different view without having to use a direct href to a route. There are different methods that use the concept of $stateprovider in AngularJS.


1 Answers

The solution is to use null instead:

gridApi.edit.on.afterCellEdit(null,function(rowEntity, colDef, newValue, oldValue)

From there you can always access the controller through the variable you set for it e.g vm and access most of what scope would contain.

like image 112
ralphowino Avatar answered Sep 30 '22 03:09

ralphowino