使用*ngFor并从离子标签检索html文本

Question

我在HTML:中使用*ngFor时遇到了一个问题

<ion-slides #slides [options]="slideOpts">
<ion-slide class="numbers-wrapper"
*ngFor="let questionNumber of numbers"
(click)="clickQuestionNumber()">
<ion-label #quesNum>{{ questionNumber }}</ion-label>
</ion-slide>
</ion-slides>

从我的TS文件中的数组：

numbers = [
'01', '02', '03', '04', '05', '06', '07', '08', '09', '10', '11', '12', '13', '14', '15', '16', '17', '18', '19', '20', '21',
'22', '23', '24', '25', '26', '27', '28', '29', '30', '31', '32', '33', '34', '35', '36', '37', '38', '39', '40'];

它工作得很好，可以随心所欲地显示，但我的问题是，我想在点击时检索离子标签｛｛questionNumber｝｝内的文本

我尝试过@viewchild和getElementbyId，但它返回(或打印(第一个值01。当我查看开发工具的HTML时，从01到40的所有HTML都在那里，它也显示在我的屏幕上。由于某种原因，我无法检索到所有的号码。我希望每当我点击01时，它都会返回01，02会返回02，依此类推

这是我的方法：

clickQuestionNumber() {
this.currentNumber = this.quesNum.nativeElement.innerText;
}

自从我尝试了各种各样的东西以来，我现在没有多少东西了，但它总是只返回第一个值。谢谢

Answer 1

您只需在(click)上执行即可

<ion-slide class="numbers-wrapper"
*ngFor="let questionNumber of numbers"
(click)="currentNumber = questionNumber">

或者，试试这样：

.html

<ion-slide class="numbers-wrapper"
*ngFor="let questionNumber of numbers"
(click)="clickQuestionNumber(questionNumber )">

.ts

clickQuestionNumber(number) {
this.currentNumber = number;
}