Listview Item onclick una etiqueta para mostrar el texto envuelto solo en el elemento de la lista seleccionado - angular, mecanografiado, nativescript, angular2-nativescript

En listview items tengo una etiqueta. Cuando haga clic en la etiqueta tiene que ampliar el texto.Por ejemplo: Por defecto, solo mostrará una línea de texto de etiqueta. Cuando hago clic en ese texto de etiqueta, tiene que expandir 10 líneas de etiqueta (Eso significa que la descripción del contenido de la etiqueta tiene 10 líneas).

Que esta pasando:

Al hacer clic en la primera etiqueta del elemento de vista de lista, está expandiendo la etiqueta a 10 líneas perfectamente usando textWrap. Pero también está expandiendo automáticamente la cuarta etiqueta de elemento de lista.

Lo que necesito:

Al hacer clic en la primera etiqueta de elemento de vista de lista, solo debe expandir el primer elemento de vista de lista textWrap. No es el cuarto texto de la etiqueta del elemento de la lista.

A continuación he publicado el código correspondiente:

archivo ts:

onClickList(args: EventData, index: number): void {

let labelArg = <Label>args.object;

var listview: ListView = <ListView>this.page.getViewById("listviewId");

listview.refresh();

labelArg.textWrap = true;

listview.refresh();

}

archivo html:

<ListView id="listviewId" [items]="_myFeedsList" class="list-group">
<ng-template let-item="item" let-i="index">
<StackLayout id="stackId">
....... .......
<Label textWrap="false" id="labelID" [text]="item.data" (tap)="onClickList($event, i)"></Label>

</StackLayout </ng-template>
</ListView>

Respuestas

2 para la respuesta № 1

Puede hacer algo muy simple si solo desea cambiar el valor textWrap del elemento tocado:

archivo ts:

toggle(event) {
if (event.object.textWrap) {
event.object.textWrap = false;
} else {
event.object.textWrap = true;
}
}

archivo html, reemplace la línea con lo siguiente:

<Label [textWrap]="false" [id]=""label" + i" [text]="item.data" (tap)="toggle($event)"></Label>

Puedes ver que cambié la Label a un valor dinámico para que pueda seleccionar cada uno de ellos más tarde si lo desea. Eso no es lo que hace que esto funcione, pero es mucho más limpio que darles la misma identificación a cada uno de ellos.

Ejemplo de trabajo aquí: https://github.com/mickaeleuranie/nativescript-stackoverflow-46910984

---

0 para la respuesta № 2

No soy "experto" en NativeScript, así que intentaréexplicar el principe solamente. Mantener una propiedad / campo para la etiqueta pulsada. Para el valor de inicio / predeterminado, dale -1. Cada vez que se haga clic en una etiqueta, establezca el valor de propiedad en el valor de índice de la etiqueta (i en su código). Y muestre / oculte / expanda las líneas de la etiqueta según la condición si la etiqueta tiene ese valor de propiedad. Espero que sea bastante claro.

selected = -1;

<Label textWrap="false" id="labelID" [text]="item.data" (tap)="selected = i; onClickList($event, i)"></Label>

---