Apr 3, 2017

How to use ng-repeat with TM1

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.

Related content

Loading related content