Provide index token to tosca function for nested lists

Index token capability is provided in tosca function for all nested levels of list and custom types

Issue-ID: SDC-4505
Signed-off-by: Imam hussain <imam.hussain@est.tech>
Change-Id: If21c0078e0d17c44b5a31b00d6fac3e18ff6831d

1 files changed, 8 insertions, 2 deletions

diff --git a/catalog-ui/src/app/ng2/pages/properties-assignment/tosca-function/tosca-get-function/tosca-get-function.component.html b/catalog-ui/src/app/ng2/pages/properties-assignment/tosca-function/tosca-get-function/tosca-get-function.component.html
index 4a9e110982..a609db41b8 100644
--- a/catalog-ui/src/app/ng2/pages/properties-assignment/tosca-function/tosca-get-function/tosca-get-function.component.html
+++ b/catalog-ui/src/app/ng2/pages/properties-assignment/tosca-function/tosca-get-function/tosca-get-function.component.html
@@ -31,10 +31,16 @@
       <select formControlName="selectedProperty" (change)="onPropertyValueChange()">
         <option *ngFor="let value of propertyDropdownList" [ngValue]="value">{{value.propertyLabel}}</option>
       </select>
-      <label class="i-sdc-form-label required" *ngIf="toscaIndexFlag">Index</label>
-      <input type="text" *ngIf="toscaIndexFlag" formControlName="toscaIndex" (change)="indexTokenChange()"/>
     </div>
     <div *ngIf="dropDownErrorMsg" class="tosca-error">{{dropDownErrorMsg}}</div>
   </form>
+  <div class="i-sdc-form-item" *ngFor="let indexVal of indexListValues; index as i">
+    <label class="i-sdc-form-label required" *ngIf="indexVal.indexFlag">Index</label>
+    <input type="text" *ngIf="indexVal.indexFlag" [(ngModel)]="indexVal.indexValue" (change)="indexTokenChange(indexVal)"/>
+    <label class="i-sdc-form-label required" *ngIf="indexVal.nestedFlag">{{dropdownValuesLabel}}</label>
+    <select [(ngModel)]="indexVal.indexProperty" *ngIf="indexVal.nestedFlag" (change)="onSubPropertyValueChange(indexVal,i)">
+      <option *ngFor="let value of indexVal.subPropertyArray" [ngValue]="value">{{value.propertyLabel}}</option>
+    </select>
+  </div>
   <loader [display]="isLoading" [size]="'medium'" [relative]="true"></loader>
 </div>