renderWith with data object in ng-click

[Chris-c-09]

Hello,
I want to use with renderWith ng-click on a function. I followed your example. It works.
However, I need to spend all my data object in my function, because is a restangular object. Only I have this error:
Syntax Error: Token 'Object' is at column {2} of the term [{3}] starting at [{4}].

My code :

button class=btn btn-warning ng-click=selectItem(data)>


Thank you in advance for your info.

Kristi

[l-lin]

If you look at the result DOM (with your browser inspector), you should see something like selectItem([Object Object]).
What you must put in your ng-click parameter must be either a value (integer, string or boolean) or a variable that is defined in your $scope. In your code, the data is not defined in your $scope but in the renderWith function, thus throwing this error.

So, put directly your wanted data in the parameter instead of the entire data object. For example:

.renderWith(function(data) {
     return '<button ng-click="selectItem(' + data.id + ', ' + data.firstName + ')">' +
                    'Select item' +
               '</button>';
});

[Chris-c-09]

Thank for response
My data object has sub object and has restangular function I need.
I can not sent my data like this.

[Chris-c-09]

hello,
Finally, at the time of restangular call, I put the result in a $scope. Then in renderWith, I pass the id in my office and in my job I do a pour on the scope. It works.

Kristi

[Abhi-joshi]

But how to define data in the $scope variable.. I'm unable to pass data as an object in ng-click.
I'm using server side pagination

[l-lin]

You can't right now. Related to #299.

[Abhi-joshi]

Okay I managed it somehow... now the next thing is like i have two api calls for fetching data and show in datatable...
1.No custom data(running successfully now)---->on page refresh
2. With filteration(not related to column filter api) but i'm using a form instead with input fields with a filter button..
So how i again call server side url again and pass my data into it and show in datatable

[l-lin]

Ok, I managed somehow to pass an object in the renderWith function.
The idea is to add the object in the $scope of the controller.

In my example, I set a temp variable vm.persons that I set to an empty object, and for each call in actionsHtml, I set the vm.persons (which acts like a map) so that my functions knows what object I'm dealing with.

vm.persons = {};
...
function edit(person) {
    ...
}
function delete(person) {
    ...
}
function createdRow(row, data, dataIndex) {
    // Recompiling so we can bind Angular directive to the DT
    $compile(angular.element(row).contents())($scope);
}
function actionsHtml(data, type, full, meta) {
    vm.persons[data.id] = data;
    return '<button class="btn btn-warning"' +
        '           ng-click="showCase.edit(showCase.persons[' + data.id + '])">' +
        '   <i class="fa fa-edit"></i>' +
        '</button>&nbsp;' +
        '<button class="btn btn-danger"' +
    '            ng-click="showCase.delete(showCase.persons[' + data.id + '])")">' +
        '   <i class="fa fa-trash-o"></i>' +
        '</button>';
}

[vinays84]

I'm currently changing datatables built with angular html code to use server-side processing and this was very helpful. I would suggest including the Binding Angular directive to the DataTable link on the Server side processing page.

[mal90]

New link for bind Angular Directive to the DataTable