6

我正在嘗試編寫一個將生成網格的指令。下面的代碼有效,但我必須指定控制器名稱'DemoCtrl'。是否有可能從指令中檢索當前的控制器名稱,以便我可以將它傳遞給buildColumn/buildRows函數?獲取AngularJS中的當前控制器名稱

angular.module('app').controller('DemoCtrl', function ($scope) { 
 
    $scope.controller = "DemoCtrl"; 
 
    $scope.coldata = [ 
 
     {name: 'Account'}, 
 
     {name: 'Name'} 
 
    ]; 
 
    $scope.rowdata = [ 
 
     { 
 
      "account": "ABC", 
 
      "name": "Jim", 
 
     }, 
 
     { 
 
      "account": "DEF", 
 
      "name": "Joe", 
 
     }, 
 
     { 
 
      "account": "GHI", 
 
      "name": "Fred", 
 
     } 
 
    ]; 
 
}); 
 

 
angular.module('foxy.components.grid', []) 
 

 
     .controller('GridController', ['$scope', '$attrs', function ($scope, $attrs) { 
 
      }]) 
 

 
     .directive('grid', function ($compile) { 
 
      return { 
 
       restrict: 'EA', 
 
       controller: 'GridController', 
 
       require: "^ngController", 
 
       scope: { 
 
        data: "=", 
 
        columns: "=", 
 
        controller: "=" 
 
       }, 
 
       link: function (scope, element, attrs, ctrl) { 
 
        scope.$watch('data', function() { 
 
         var el = $compile(buildGrid(scope.controller))(scope); 
 
         element.replaceWith(el); 
 
         element = el; 
 
        }); 
 

 
       } 
 
      }; 
 
     }) 
 

 
function buildGrid(controller) { 
 
    var html = "<table>"; 
 

 
    html += "<thead>"; 
 
    html += buildColumn(controller); 
 
    html += "</thead>"; 
 

 
    html += "<tbody>"; 
 
    html += buildRows(controller); 
 
    html +="</body>"; 
 

 
    html += "</table>"; 
 

 
    return html; 
 
} 
 
function buildColumn(controller) { 
 
    try { 
 
     var html = ""; 
 
     var dom_el = document.querySelector('[ng-controller="' + controller + '"]'); 
 
     var ng_el = angular.element(dom_el); 
 
     var ng_el_scope = ng_el.scope(); 
 
     var colname = ng_el_scope.coldata; 
 

 
     html += "<tr>"; 
 

 
     for (i = 0; i < colname.length; i++) { 
 
      html += "<th>"; 
 
      html += colname[i]["name"]; 
 
      html += "</th>"; 
 
     } 
 

 
     html += "</tr>"; 
 

 
     return html; 
 
    } catch (err) { 
 
     return "#error" + err; 
 
    } 
 
} 
 

 
function buildRows(controller) { 
 
    try { 
 
     var html = ""; 
 
     var dom_el = document.querySelector('[ng-controller="' + controller + '"]'); 
 
     var ng_el = angular.element(dom_el); 
 
     var ng_el_scope = ng_el.scope(); 
 
     var colname = ng_el_scope.coldata; 
 
     var rows = ng_el_scope.rowdata; 
 

 
     for (j = 0; j < rows.length; j++) { 
 
      html += "<tr>"; 
 

 
      for (data in rows[j]) { 
 
       html += "<td>"; 
 
       html += rows[j][data]; 
 
       html += "</td>"; 
 
      } 
 

 
      html += "</tr>"; 
 
     } 
 

 
     return html; 
 
    } catch (err) { 
 
     return "#error" + err; 
 
    } 
 
}

+1

完全與您的問題無關,但您應該簽出'+ ='運算符。 – m90

回答

2

你可以使用你的路線服務來獲取控制器名稱

{{$route.current.scope.name}} 
+3

似乎應該是'$ route.current.controller' – Max

1

我已經更新了我與我的解決方案的代碼,我決定創建一個新的變量範圍傳遞給buildGrid函數的控制器名稱。不理想,但它的工作原理!