我有两个下拉列表,其中填充了来自服务器的数据。第一个下拉列表包含州,第二个包含城市。就像我选择一个州名一样,只有该州的城市应该使用 Angular 4 显示在第二个下拉列表中。
<mat-tab-group>
<mat-tab label="Basic Info">
<ng-template mat-tab-label>
<div fxLayout="center center">
<mat-icon style="font-size: 16px; line-height: 18px">gps_fixed</mat-icon>
State
</div>
</ng-template><br /><br /><br /><br />
<div class="ui fluid container" fusePerfectScrollbar>
<div class="content">
<mat-form-field>
<mat-select placeholder="State" [(ngModel)]="selectedValue" name="state" (change)="dropdownchange($event.target.value)">
<mat-option>None</mat-option>
<mat-option *ngFor="let state of states" [value]="state">{{state}}</mat-option>
</mat-select>
</mat-form-field><br />
<h3>You selected: {{selectedValue}}</h3>
</div>
</div>
</mat-tab>
<mat-tab label="Location">
<ng-template mat-tab-label>
<div fxLayout="center center">
<mat-icon style="font-size: 16px; line-height: 18px">location_on</mat-icon>
City
</div>
</ng-template>
<div class="ui fluid container" fusePerfectScrollbar>
<div class="ui fluid container" fusePerfectScrollbar>
<div …Run Code Online (Sandbox Code Playgroud)