CODEWITHSUNDEEP
angular
user348173
user348173

Reputation: 9278

Angular2. Dynamic component creation

I have a simple table: 

...
   <tr>
      <td>
        <a href="#">Add select</a>
      </td>
       <td>
        <a href="#">Add select</a>
      </td>
       <td>
        <a href="#">Add select</a>
      </td>
    </tr>
     <tr>
      <td>
        <a href="#">Add select</a>
      </td>
       <td>
        <a href="#">Add select</a>
      </td>
       <td>
        <a href="#">Add select</a>
      </td>
    </tr>

When user clicks on Add Select link I want to create select tag. For dropdown list I use ng2-select So, I have two problems, how to get specific td when user clicks Add select and how to create select component in that td.

Upvotes: 1

Views: 146

Answers (1)

G&#252;nter Z&#246;chbauer
G&#252;nter Z&#246;chbauer

Reputation: 657058

<tr>
  <td>
    <a href="#" (click)="addSelect(0)">Add select</a>
    <ng2-select *ngFor="let item in ng2Selects[0]"></ng2-select>
  </td>
   <td>
     <a href="#" (click)="addSelect(1)">Add select</a>
     <ng2-select *ngFor="let item in ng2Selects[1]"></ng2-select>
  </td>
   <td>

ng2Selects = [];
addSelect(index:number) {
  if(this.ng2Selects.length < index) {
    this.ng2Selects[index] = [];
  }
  this.ng2Selects[index].push('dummy');
}

Upvotes: 1

Related Questions