Apr 26 2017
How to use ng-repeat with TM1
ng-repeat is an Angular JS directives, it loop over a template for each item in a collection. For more general information about ng-repeat, you can check the Angular Help section.
Definition
ng-repeat is an Angular JS directives, it loop over a template for each item in a collection. For more general information about ng-repeat, you can check the Angular Help section.
Syntax
ng-repeat=”<object name> in page.<collection name>”.
For example: ng-repeat=”dept in page.depts”. One object “dept” will be created for each department in the collection “depts”.
The collection can be created by tm1-ui-element-list:
<tm1-ui-element-list tm1-instance="dev" tm1-dimension="Department" tm1-subset="Corporate1" ng-model="page.depts"></tm1-ui-element-list>
ng-repeat with TM1
The main use of ng-repeat with TM1 will be to create a table. ng-repeat in a tr tag will create one row per elements in the collection:
<tbody> <tr ng-repeat="dept in page.depts"> <td>{{dept.description}}</td> <td> <tm1-ui-dbr tm1-instance="dev" tm1-cube="General Ledger" tm1-elements="Actual,2012,Year,Local,Total Europe,{{dept.description}},Net Income,Amount" tm1-data-decimal="2" ></tm1-ui-dbr> </td> </tr> </tbody>
NEST TWO ng-repeat
You can nest two ng-repeat together in order to create a more complex table. The first ng-repeat in the tr tag will create the rows and the second one in the td tag will create one column per element in the collection.
<tbody> <tr ng-repeat="dept in page.depts"> <td>{{dept.description}}</td> <td ng-repeat="version in page.versions"> <tm1-ui-dbr tm1-instance="dev" tm1-cube="General Ledger" tm1-elements="{{version.description}},2012,Year,Local,Total Europe,{{dept.description}},Net Income,Amount" tm1-data-decimal="2" ></tm1-ui-dbr> </td> </tr> </tbody>
The output will be:
By using one ng-repeat for the row and an other for the column, the rows and the columns of your table is now driven by a subset. Any changes that you make on the subsets will be automatically reflected into Canvas.