呼叫AngularJS指令上点击

快速的问题，所以我用tg-dynamic-directive遍历下面的树一个JSON文件和输出。（见图片附后）呼叫AngularJS指令上点击

所以，问题是，当“树”变得非常长有，因为浏览器需要渲染很多项目的一些严重的性能问题。（我说的是1000或更长）。所以我试图做的是最初只加载前两个级别，其余的将被折叠。当用户点击每个元素的展开箭头时，我需要渲染其子元素。（如果这是有道理的）。所以基本上再次运行tg-dynamic-directive。

当页面开始渲染以及与HTML被激发我有这样的检查，如果它的第一个2级返回模板函数：

$scope.getView = function (item) { 

     // Check if item is defined 
     if(typeof item != 'undefined') { 

      // Load course, label and module first! 
      if(item.type == 'course' || item.type == 'label' || item.type == 'module' || item.type == 'course_assessment' || item.type == 'module_assessment') { 
       // Return Template 
       return 'nestable_item.html'; 
      } else { 
       // Otherwise return null 
       return null; 
      } 
     } else { 
      return null; 
     } 
    };

那我需要做的就是再次调用指令时展开箭头被点击。

这是指令：

angular.module('tg.dynamicDirective', []) 
    .directive('tgDynamicDirective', ['$compile', 
     function($compile) { 
      'use strict'; 

      function templateUrlProvider(getView, ngModelItem) { 
       if (getView) { 
        if (typeof getView === 'function') { 
         var templateUrl = getView(ngModelItem) || ''; 
         if (templateUrl) { 
          return templateUrl; 
         } 
        } else if (typeof getView === 'string' && getView.length) { 
         return getView; 
        } 
       } 
       return ''; 
      } 

      return { 
       restrict: 'E', 
       require: '^ngModel', 
       scope: true, 
       template: '<div ng-include="templateUrl"></div>', 
       link: function(scope, element, attrs, ngModel) { 

        scope.$watch(function() { 
         var ngModelItem = scope.$eval(attrs.ngModel); 
         var getView = scope.$eval(attrs.tgDynamicDirectiveView); 
         scope.ngModelItem = ngModelItem; 
         return templateUrlProvider(getView, ngModelItem); 
        }, function(newValue, oldValue) { 
         scope.templateUrl = newValue; 
        }); 
       } 
      }; 
     } 
    ]);

我的问题是我怎么能火TG-动态指令从控制器点击时再展开箭头。

来源

2017-02-27 TSlegaitis

使用$rootScope.broadcast("XXXXXX");并抓住它的指令

$rootScope.$on("XXXXXX", function() { 
    // function call 
})

，并打电话给你想要的功能。或使用document.createElement（“tg-dynamic-directive”）;

来源

2017-02-27 15:05:16

呼叫AngularJS指令上点击

回答

相关问题