object-table icon indicating copy to clipboard operation
object-table copied to clipboard

Not able to use ngRepeat to generate table <td>s

Open Parthvora opened this issue 10 years ago • 2 comments

Hello,

Can anyone please help me to generate the dynamic < td >s in the table? Not working: < tbody> < tr> < td ng-repeat="col in columns"> {{ col }} < /td> < /tr> < /tbody>

However, ngRepeat for other tags is working: < tbody> < tr> < td> < p ng-repeat="col in columns"> {{ col }} < /p> < /td> < /tr> < /tbody>

Parthvora avatar Jan 27 '16 10:01 Parthvora

It's possible.

  1. add ng-non-bindable attribute to your tbody see here. It will prevent to compile ng-repeat by angular before directive will be compiled.
  2. if columns is a property of controller scope - it should be $owner.columns.

ekokotov avatar Jan 29 '16 12:01 ekokotov

Thanks a lot man, it worked for < td>s But I'm facing issues while generating < th>s using ngRepeat. I'm able to generate the < th>s dynamically using ngRepeat, but the issue is with column drag.

When I'm trying to drag a column I'm getting: TypeError: Failed to execute 'appendChild' on 'Node': parameter 1 is not of type 'Node'.

Here is my code: HTML: < table object-table data="users" headers="Fname,Lname,Phone,Email" fields="columns" sorting="no" paging="no" search="no" display="recPerPage"> < thead> < tr> < th ng-repeat="col in $owner.columns" allow-drag> {{ col.title }} < /th> < /tr> < /thead> < tbody ng-non-bindable> < tr> < td ng-repeat="col in $owner.columns"> {{ ::item[col.field] }} < /td> < /tr> < /tbody> < /table>

I have tried "ng-non-bindable" on < thead> as well as on < th> of table header, but not useful here.

So, anyway I can generate dynamic < th>s with ngRepeat and which are also draggable?

Thanks

Parthvora avatar Jan 29 '16 12:01 Parthvora