2016-12-27 63 views
1

我最近幾天剛開始發現ui-grid。 的ui.grid.class:GridOptions的文檔顯示關於如何使用該rowTemplate屬性的示例:什麼是colContainer屬性,以及我可以在哪裏找到它的文檔

rowTemplate

'UI-格/ UI格列' 默認情況下。提供時,此設置使用自定義行模板。可設置一個模板文件的任何名稱:

$scope.gridOptions.rowTemplate = 'row_template.html'; 

內嵌HTML

$scope.gridOptions.rowTemplate = '<div style="background-color: aquamarine" ng-click="grid.appScope.fnOne(row)" ng-repeat="col in colContainer.renderedColumns track by col.colDef.name" class="ui-grid-cell" ui-grid-cell></div>'; 

正如你可以在rowTemplate HTML代碼中看到有一個ng-repeat其中超過colContainer.renderedColumnscol項目進行迭代,並且有track by選項,它使用col.colDef.name

相同的模板也用於317_custom_templates tutorial example

我一直在尋找的文檔中的colContainer財產的來源,我只能ui.grid.cellNav.object:CellNav下找到具有相同名稱的屬性沒有任何細節(我已經不知道這是否正是使用了相同的colContainer財產在rowTemplate上面的例子,並在317_custom_templates tutorial example因爲202 Cell Navigation tutorial有人說: > To enable, you must include the 'ui.grid.cellNav' module並在317_custom_templates tutorial example沒有如注此模塊) 還有下ui.grid.class:ScrollEvent屬性sourceColContainer但它是不一樣的poperty名稱,但也許它可能是它的起源。

我想查找colContainer屬性的文檔並更好地理解它,並知道它的子屬性(如果存在的話)(除colDef.name之外)或者至少我會知道它的來源並查看它的代碼源if沒有任何文檔可能也是有用的。

此致敬禮。

+0

我發現col是來自類http://ui-grid.info/docs/#/api/ui.grid.class:GridColumn – Bardelman

回答

1

我發現這個/src/js/core/directives/ui-grid-render-container.js:47

var colContainer = $scope.colContainer = grid.renderContainers[$scope.colContainerName]; 

所以colContainer其實是在渲染容器,您可以訪問外指令和模板做$scope.gridApi.grid.renderContainers["nameOfColContainer"]

知道nameOfColContainer你將不得不在這裏檢查您的模板


/src/templates/ui-grid/ui-grid.html:33):

<div ui-grid-render-container 
     container-id="'body'" 
     col-container-name="'body'" 
     row-container-name="'body'" 
     bind-scroll-horizontal="true" 
     bind-scroll-vertical="true" 
     enable-horizontal-scrollbar="grid.options.enableHorizontalScrollbar" 
     enable-vertical-scrollbar="grid.options.enableVerticalScrollbar"> 
    </div> 

所以這肯定是身體。在renderContainer中,您將擁有一個名爲renderedColumns的對象,其中包含要呈現的列。 您還可以訪問「身體」以外的其他容器:左右。 這是如果您使用固定的左側和/或右側,身體是中心容器。

相關問題