Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

318
Visualizações
Ionic4 + Angular: la creación dinámica de selección de iones con *ngFor da como resultado la vinculación de todas las opciones de selección de iones (sin querer)

Necesito crear una lista de ion-select basada en una matriz dentro de un objeto llamado myObject.array .

  • Cuando creo la lista usando mypage.page.ts y mypage.page.html que se enumeran a continuación. Todas mis ion-select-options se vinculan entre sí, por lo que cuando cambio una ion-select a Y , todas las selecciones de iones cambian a Y , etc.
  • Puedo ver en el registro de mi consola que ionChange se activa solo una vez; dentro de él, también puedo ver los datos correctos (que solo se cambia un elemento dentro de myObject.array).
  • El problema es que la interfaz de usuario no se corresponde con los datos dentro de mypage.page.ts

La imagen a continuación muestra la interfaz de usuario después de cambiar solo una ion-select y el registro de la consola (puede ver que varias ion-select cambiaron y los datos de registro de la consola no se corresponden con la interfaz de usuario):

ingrese la descripción de la imagen aquí

¿Cómo puedo crear ion-selects dinámicamente a partir de una matriz y no vincularlos entre sí?

Editar:

  • Los errores en la consola están relacionados con las cookies (con este mensaje de error: Indicate whether to send a cookie in a cross-site request by specifying its SameSite attribute ).
  • Los errores no están relacionados con mi código porque si agrego la página o la elimino, todavía están allí.

Mi código:

 <ion-header> <ion-toolbar> <ion-title>mypage</ion-title> </ion-toolbar> </ion-header> <ion-content> <ion-item *ngFor="let output of myObject.array;let i=index;"> <ion-label> Array object {{i}}</ion-label> <ion-select [(ngModel)]="myObject.array[i]" (ionChange)="change($event, i)" okText="Set" cancelText="Throw away"> <ion-select-option value="Y"> Yes? </ion-select-option> <ion-select-option value="N"> No? </ion-select-option> </ion-select> </ion-item> </ion-content>

Y este código mypage.page.ts :

 import { Component, OnInit } from '@angular/core'; @Component({ selector: 'app-mypage', templateUrl: './mypage.page.html', styleUrls: ['./mypage.page.scss'], }) export class MypagePage implements OnInit { myObject = {array: ['Y','Y','Y']}; constructor() { } ngOnInit() { } change(event, i){ console.log(event); console.log(i); console.log(this.myObject); }
about 4 years ago · Juan Pablo Isaza
1 Respostas
Responde à pergunta

0

trackBy es algo hecho para mejorar el rendimiento de detección de cambios.

Solo para que conste, así es como uno lo convierte en el índice "trackBy":

Cambio de plantilla

 <ion-item *ngFor="let output of myObject.array; let i=index; trackBy:indexTracker;">

Cambio de controlador

 indexTracker(index: number, value: any) { return index; }
about 4 years ago · Juan Pablo Isaza Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda