Dismiss
Announcing Stack Overflow Documentation

We started with Q&A. Technical documentation is next, and we need your help.

Whether you're a beginner or an experienced developer, you can contribute.

Sign up and start helping → Learn more about Documentation →

Here is a plunker as requested- http://plnkr.co/edit/tIkBFO?p=preview

I am using the controllerAs pattern. I have been using the cell template with a filter($sce) to sanitize, and then build HTML. For the life of me, I cannot get the ng-click to register to my controller.

I can change the cell template to cellTemplate:'<button ng-click="grid.appScope.user.delete(\'works!\')">X</button>'-> This works.

Is there anyway to NOT use cell template and still get to the controller? Details column is where I am having issues.

Thanks for reading!

Related issues- https://github.com/angular-ui/ui-grid/issues/4116

https://github.com/angular-ui/ui-grid/issues/4886

Here is the code-

        var user = this;

        user.gridDefs = [{
                            displayName: 'User ID',
                            name: 'userId',
                            width: "10%"
                        }, {
                            name: 'firstName',
                            width: "15%"
                        }, {
                            name: 'lastName',
                            width: "15%"
                        }, {
                            name: 'email',
                            cellTemplate: '<div ng-bind-html="COL_FIELD |trustedclean"></div>',
                            width: "25%"
                        }, {
                            name: 'username',
                            width: "15%"
                        }, {
                            name: 'details',
                            cellTemplate:'<div ng-bind-html="COL_FIELD |trustedclean"></div>'
                            width: "20%"
                        }, ];

user.gridData = _.map(dataFromSvc.users, function(user) {
                    var buildDetailsString = buildDetails(user.uid);
                    var object = {
                        'userId': user.Id,
                        'firstName': user.firstName,
                        'lastName': user.lastName,
                        'email': '<a href=\"mailto:' + user.primaryEmail + '\">' + user.primaryEmail + '</a>',
                        'username': user.uid,
                        'details': '<div><a href=\"#/viewuser/'+user.uid+'/true\">View</a>/<a ng-click=\"user.deleteUser('+user.uid+')\">Delete</a></div>'
                    return object;
                });

    user.deleteUser = function(uid) {
                    console.log(uid);

                };

Here is the HTML-

<div id="grid2" ui-grid="{ data: user.gridData, columnDefs:user.gridDefs}" class="grid"></div>
share|improve this question
1  
If you can create a plunkr, I'd take a look at it – panzhuli Jul 8 at 22:07
    
Sorry took me a while to get it working- plnkr.co/edit/tIkBFO?p=preview – apaul Jul 8 at 22:57
1  
Looks like you're doing it correctly with the cellTemplate. Is there a reason you don't want to use it? That's kind of what it is for... If you don't like your HTML in your js, you can use an external file just as easily... – panzhuli Jul 8 at 23:20
    
I show users different options between view, and delete depending on what role they have. Just thought it would be easier to not be doing it in the template. I guess drop the filter, add a conditional around what the cell template will be. – apaul Jul 8 at 23:45
up vote 0 down vote accepted

Answering my own question-

Do not sanitize, and use ng-bind on ui-grid. Use the template to manage your cells. This is what I did.

cellTemplate:dynamicTemplate
share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.