custom directive in cell template in ui-grid angularjs -


i define ui-grid display data, , define cell template set column style. @ same time create directive, here add cell template. link function execution times less expectation.

here's whole thing on plunker: link

var app = angular.module("app", ['ui.grid']);  app.controller("datactrl", function ($scope, $element, $attrs) { var vm = this; vm.gridoptions = {     data: "ctrl.datalist",     columndefs: [                 {                     name: "id",                     displayname: "user id",                     width: 200                 },                 {                     name: "name", displayname: "user name",                     celltemplate: "<div class=\"ui-grid-cell-contents\" pop-tip><span style=\"margin-left:5px\">{{row.entity[\"name\"]}}</span></div>"                 }     ],     enablerowselection: true,     enablerowheaderselection: false,     multiselect: false,     nounselect: true, };  vm.datalist = []; vm.loaddata = function () {      (var = 1; <= 100; i++) {         var user = {};         user.id = i;         user.name = 'user ' + i;         vm.datalist.push(user);     } }  vm.loaddata(); });  app.directive("poptip", function ($compile) { return {     restrict: 'a',     scope: false,     link: function ($scope, $element, $attrs) {         console.log($scope.row.entity.name);     } }; }) 

you can browser log view time of link execution.

the result when data amount large appears vertical scroll, when drag scroll bar custom directive not execute link function anymore.

it's quite there optimization built ui-grid, whereby reuse already-linked row elements, rather link new ones.

you inspect (and, should need) $watch-ing changes in scope:

link: function ($scope, $element, $attrs) {     //console.log($scope.row.entity.name);     $scope.$watch("row.entity.name", function(v){        console.log(v);     }); } 

this display rows when scrolling.

demo


Comments

Popular posts from this blog

apache - PHP Soap issue while content length is larger -

asynchronous - Python asyncio task got bad yield -

javascript - Complete OpenIDConnect auth when requesting via Ajax -