Расширение селектора без использования CSS

#html #css #angular

Вопрос:

В моем HTML у меня есть таблица, которая в основном идет:

| 1 | $3.00 |

| 2 | $5.00 |

| 3 | $1.00 |

И вы можете переключаться между ними туда и обратно, что подсвечивается нажатием на числовое значение. Код, лежащий в основе Angular, использует event.target в качестве элемента для получения числа. Я хочу также иметь возможность щелкнуть по полю суммы, но единственное решение, которое я могу придумать, — это сделать так, чтобы CSS поля числа перекрывался над полем суммы… что, я знаю, ужасная идея. В угловой функциональности я не могу найти способ присвоить номер индекса определенному полю при нажатии на него. Как мне сделать так, чтобы я мог нажать на «$3,00 » и получить номер #1?

HTML:

 <td>
        <tr id='{{ code }}' *ngFor="let code of this.codeArr" (click)="specificCheckDetails($event)">{{ code }}</tr>
    </td>

    <td>
        <tr id="{{ item }}" *ngFor="let item of this.itemArr">${{ item }}</tr>
    </td>
 

Комментарии:

1. Создается ли ваша таблица с помощью цикла *ngFor на основе массива в вашем коде TS?

2. вы можете показать свой код? Пожалуйста, вставьте его сюда в свой вопрос? С помощью цикла вы получаете индекс, и вы можете легко проверить его, если он через *ngFor . Пожалуйста, поделитесь своим кодом.

3. Добавлен код и исправлено поле… оно не использует значение индекса, это отдельный массив. Приношу свои извинения

Ответ №1:

Если это список, используя *ngFor который вы можете сделать что-то вроде:

 <div *ngFor="let item of items; index as i">
    <div class="item" (click)="executeAction(item, i)">{{item.name}}</div>
</div>