recorrer - seleccionar solo un checkbox c#

Cómo llamar a una función al desmarcar y verificar con Aurelia

Question

Tengo una lista de elementos que provienen de una API y no siempre serán los mismos, por lo que la cantidad de elementos en la matriz siempre cambia. Estoy creando una casilla para cada artículo.

El usuario tiene la capacidad de marcar / desmarcar cada elemento. Esto es lo que quiero hacer:

1. Cuando se marca un elemento, insertará la ID de ese elemento en una matriz
2. Cuando un elemento está desmarcado, eliminará la ID de ese elemento de la matriz

Solo necesito saber cómo llamo algo en función de si fue marcado o no. Intenté un "cheque.delegate" y un "checked.trigger" y parece que no puedo hacer que funcione.

Solo un click.delegate regular no funcionará porque no puedo mantener el estado si es verdadero o falso y no puedo establecer variables para todos ellos porque no siempre sé qué elementos van a venir de la API. ¿Alguna sugerencia?

Answer 1

Pruebe change.delegate o change.trigger siguiente manera:

Método de VM:

logchange(value) {
  console.log(value);
}

Ver:

<input type="checkbox" change.delegate="logchange($event.target.checked)" />

Answer 2

Una forma de hacerlo es con la ayuda de un colocador. Supongamos que tiene una casilla de verificación como esta:

<input type="checkbox">

Cree un campo privado en su Modelo de Vista y luego envuélvalo con un captador y un colocador:

get isChecked(){
    return this._isChecked;
}

set isChecked(value){
    this._isChecked = value;
    //enter your extra logic here, no need for an event handler
}

private _isChecked: boolean;

A continuación, vincular isChecked a la vista:

<input type="checkbox" checked.bind="isChecked">

Cada vez que se marque o desmarque la casilla de verificación, se llamará al colocador y podrá llamar a cualquier método que desee desde el setter.

Otra manera poco convencional de lograr esto es usar el decorador @bindable así:

@bindable isChecked: boolean;

No es convencional porque probablemente no quieras. isChecked para ser enlazable, pero el decorador te da acceso al método isCheckedChanged :

isCheckedChanged(newValue, oldValue){
     //Logic here
}

Y, por supuesto, está el evento de change que puede atrapar con change.trigger y change.delegate pero eso ya se ha mencionado en otra respuesta