html选择下拉列表不更改页面数据

afdcj2ne  于 2021-09-29  发布在  Java
关注(0)|答案(2)|浏览(364)

我试图在我的html页面上创建一个下拉列表来选择年份。我有一个像这样的数组:

0: {number: 3, name: "Year 3", subjects: Array(5)}
1: {number: 4, name: "Year 4", subjects: Array(5)}
2: {number: 5, name: "Year 5", subjects: Array(5)}

当选择一年时,我希望它检查该年是否有selectedsubject,如果有,打印名称。以下是我的html代码:

<select [(ngModel)]="selectedYear.name">
    <option
      [label]="year.name"
      *ngFor="let year of yearDropdown"
      [selected]="selected"
      [value]="year.name"
    ></option>
  </select>

  <div class="card-body">
    {{ selectedYear.name }}
    <div *ngFor="let subject of selectedYear.subjects">
      <ng-container *ngIf="subject.name === selectedSubject.name">
        {{ subject.name }}
      </ng-container>
    </div>
  </div>

但是,它只在第一次加载时打印出值,选择一年一次时不会重新运行代码。有人知道怎么做吗?

7ivaypg9

7ivaypg91#

将onchange添加到您的select <select onchange="onChange()"> 这样地
试试这个:

import {ChangeDetectorRef} from @angular/core

constructor(private ref:ChangeDetectorRef){}

onChange() {
    this.ref.detectChanges();
}
bwntbbo3

bwntbbo32#

要动态显示年份下拉列表,可以执行以下操作
显示年份下拉列表,年份<当前年份
var min=new date().getfullyear(),//当前年份stop=2000//要停止的年份select=document.getelementbyid('selectelementid');
对于(var i=最小值;i>=停止;i--{var opt=document.createelement('option');opt.value=i;opt.innerhtml=i;select.appendchild(opt);}
显示年份下拉列表,年份>当前年份
var min=new date().getfullyear(),max=min+15,select=document.getelementbyid('selectelementid');
对于(var i=最小值;i<=最大值;i++{var opt=document.createelement('option');opt.value=i;opt.innerhtml=i;select.appendchild(opt);}

相关问题