khan4019 / tree-grid-directive

Need one or more maintainer for this! comment or email me if you are interested
http://khan4019.github.io/tree-grid-directive/test/treeGrid.html
347 stars 183 forks source link

cellTemplate not working within $scope.expanding_property #74

Closed garywilliams933 closed 8 years ago

garywilliams933 commented 8 years ago

The cellTemplate property doesn't seem to work when used within $scope.expanding_property.

Here is my sample code ... $scope.expanding_property = { field: "Name", displayName: "Name", sortable : true, filterable: true, cellTemplate: '{{ row.branch.Name }}' }; ...

Thanks

torsten-sauer commented 8 years ago

A little bit late, but for reference... You can easily archive what you want if you use your own template. You need to add the following code (or something equal for your case): <span class="indented tree-label" ng-click="on_user_click(row.branch)" ng-if="expandingProperty.cellTemplate" compile="expandingProperty.cellTemplate" cell.template-scope="expandingProperty.cellTemplateScope"></span>

Full Example: (a copy of the original template, with added support for celTemplate on expanding_property)

<div class="table-responsive">
   <table class="table tree-grid">
   <thead>
     <tr>
       <th><a ng-if="expandingProperty.sortable" ng-click="sortBy(expandingProperty)">{{expandingProperty.displayName || expandingProperty.field || expandingProperty}}</a><span ng-if="!expandingProperty.sortable">{{expandingProperty.displayName || expandingProperty.field || expandingProperty}}</span><i ng-if="expandingProperty.sorted" class="{{expandingProperty.sortingIcon}} pull-right"></i></th>
       <th ng-repeat="col in colDefinitions"><a ng-if="col.sortable" ng-click="sortBy(col)">{{col.displayName || col.field}}</a><span ng-if="!col.sortable">{{col.displayName || col.field}}</span><i ng-if="col.sorted" class="{{col.sortingIcon}} pull-right"></i></th>
     </tr>
   </thead>
   <tbody>
     <tr ng-repeat="row in tree_rows | searchFor:$parent.filterString:expandingProperty:colDefinitions track by row.branch.uid"
       ng-class="'level-' + {{ row.level }} + (row.branch.selected ? ' active':'')" class="tree-grid-row">
       <td><a ng-click="user_clicks_branch(row.branch)"><i ng-class="row.tree_icon"
              ng-click="row.branch.expanded = !row.branch.expanded"
              class="indented tree-icon"></i></a><span ng-if="!expandingProperty.cellTemplate" class="indented tree-label" ng-click="on_user_click(row.branch)">
             {{row.branch[expandingProperty.field] || row.branch[expandingProperty]}}</span><span class="indented tree-label" ng-click="on_user_click(row.branch)" ng-if="expandingProperty.cellTemplate" compile="expandingProperty.cellTemplate" cell.template-scope="expandingProperty.cellTemplateScope"></span>
       </td>
       <td ng-repeat="col in colDefinitions">
         <div ng-if="col.cellTemplate" compile="col.cellTemplate" cell-template-scope="col.cellTemplateScope"></div>
         <div ng-if="!col.cellTemplate">{{row.branch[col.field]}}</div>
       </td>
     </tr>
   </tbody>
 </table>
</div>
garywilliams933 commented 8 years ago

That makes sense. Thanks for the reply!

TrueDub commented 8 years ago

Closing this as solved. Thanks to @torsten-sauer for the solution.