ngGrid with flexible-height plugin not working

Question

Im wrapping ng-grid inside a custom directive where i have tons of custom stuff for my needs. Everything is working except the plugins (i think none its working, but i only need the flexible-height)

I made this plunker with a simplified version of my directive for ilustrate the problem: http://plnkr.co/edit/SexqquszSgvDSMqlLBRQ?p=preview

The browser console is showing one error (that is related to the plugins, if u remove the plugin injection, the error disappear), and the height is not adapting to the ammount of elements in the table

Answer 1

This should probably be in the link section instead. Also, trying to use an isolate scope in your own directive may cause collisions with the ng-grid directive you're wrapping, but it's really unnecessary because you can access the directive's attributes directly. See the simplified Plunker here.

.directive("myGrid", function($compile){
  return {
    restrict: "E",
    link:  function(scope, element, attrs) {
      var localCss = attrs.myCss;
      if(!localCss){
        localCss = 'defaultGridStyle';
      }
      scope.isEmpty = function(){
        return (!scope.disableErrormsj && angular.isDefined(scope.myData) && scope.myData.length === 0);
      };

      var html = '<div class="col-xs-12" ng-if="!isEmpty()"><div ng-grid="' + attrs.myOptions + '" class="' + localCss + '"></div></div>' +
        '<div class="col-xs-12" ng-if="isEmpty()"><p class="bg-info">No matches found</p></div>';
      var e = $compile(html)(scope);
      element.replaceWith(e);
    }
  };
})