2

estou desenvolvendo um aplicativo ionic/angular com um BD firestore ate ai tudo bem. eu gostaria de fazer isto link do post Eu consigo injetar o codigo via "ng-template" porem não sei como posso fazer para ele se repetir toda vez que o clico de um botão.

tela da lista Gostaria de clicar aqui e duplicar o codigo acima

adicionarOutroItem(){
// ??????
}
<ion-header>
  <ion-navbar>
    <ion-title>addItem</ion-title>
  </ion-navbar>
</ion-header>


<ion-content padding>
  <table>
    <tr *ngIf="editar == true">
      <td>Nome da Lista: </td>
      <td><input class="texto3"></td>
    </tr>


    <tr>
      <td>Nome:</td>
      <td><input class="texto3"  [(ngModel)]="nome_item"> </td>
    </tr>

    <tr>
      <td>Quantidade:</td>
      <td>
        <button ion-button class="botaoLista" (click)="diminuirQtd()">-</button> 
        <input type="text" class="texto2" value="{{qtd}}"/> 
        <button ion-button class="botaoLista" (click)="aumentarQtd()">+</button>
      </td>
    </tr>

    <tr>
      <td style="float: right;">Observação:</td>
      <td><textarea [(ngModel)]="obs" rows="10" cols="30" style="margin:2% 0%"></textarea></td>
    </tr>
  </table>
  <button ion-button full color="secondary" (click)="adicionarOutroItem()">Adicionar outro Item</button>
  <br /><br /><br />
  <button ion-button full style="margin-bottom: 3%;" (click)="addItem()">Salvar</button>
  <button ion-button full color="danger" (click)="removeItem()">Deletar</button>

</ion-content>

1
  • Adicione o código na pergunta e não apenas capturas de tela. 3/10/2018 às 17:56

1 Resposta 1

2

Você consegue utilizar a diretiva *ngFor para resolver seu problema. Você deverá manter os itens que você deseja exibir em uma variável do tipo array, e utilizar a diretiva *ngFor para iterar esses itens e adicioná-los dinamicamente na sua tela.

Dê uma estudada na documentação do ngFor que está disponível aqui https://angular.io/guide/displaying-data#showing-an-array-property-with-ngfor

1
  • 1
    Nossa uma solução tão simples e eu não pensei nisto... obrigado vou tentar fazer
    – williamSM
    4/10/2018 às 13:40

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .