呼叫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指令上點擊

回答

相關問題