我试图把jQuery的迷你图在各行中的一个单元格中的NG-电网。该列包含数字阵列的数据。

I am trying to bring jQuery Sparkline at each row in one cell in ng-grid. The column contains numeric array data.

Plunkr - > http://plnkr.co/edit/1eNEcx6FQWcJynlVYvFw?p = preVIEW

Plunkr --> http://plnkr.co/edit/1eNEcx6FQWcJynlVYvFw?p=preview

我使用的指令与细胞模板来实现这一目标。

I am using directive with cell template to achieve this.

单元模板：    

Cell Template:

指令：

app.directive('ngAge', function() {
  return{
    restrict: 'C',
    replace: true,
    translude: true,
    scope: {ngAgeData: '@'},
    template: '<div>' +
              '<div class="sparklines"></div>' +
                '</div>',
    link: function(scope,element,attrs){
     // var arrvalue= "3386.24000,1107.04000,3418.80000,3353.68000,4232.80000,3874.64000,3483.92000,2735.04000,2474.56000,3288.56000,4395.60000,1107.04000";
     //console.log(attrs.ngAgeData);
     var arrvalue = attrs.ngAgeData;
     var myvalues = new Array();
     myvalues = arrvalue.split(",");
     $('.sparklines').sparkline(myvalues); 

    }
  }
});

我有在获得链接函数内attrs.ngAgeData值的困难。我不知道我错过了什么。请帮助！

I am having difficulty in getting the attrs.ngAgeData value inside the link function. I am not sure what I am missing. Please help!!!

感谢

推荐答案

使用此celltemplate：

Use this celltemplate:

cellTemplate: '<div age-line agedata=row.entity.age></div>'

请注意，该值是作为属性传递。

Note that the values are passed as attributes.

该指令应该是：

app.directive('ageLine', function () {
    return {
        restrict: 'A',
        scope: { agedata: '=' },
        link: function (scope, elem) {
            scope.$watch('agedata', function (newval) {
                elem.sparkline(scope.agedata);
            });
        }
    };
});

另外请注意，你不需要的$，因为该元素已经是一个jQuery的（精简版）的对象。

Also note that you dont need the $., since the element is already an jquery(lite) object.

下面是一个工作plunker： http://plnkr.co/edit/oDbPp9DGFCGGZF30Bzsi p = preVIEW

Here is a working plunker: http://plnkr.co/edit/oDbPp9DGFCGGZF30Bzsi?p=preview