我正在尝试使用 nix-select-dropdown 为商店 ID 制作可搜索的下拉列表。我最初只用一个输入框创建了这个页面，一切都很好。一旦我在此标记后添加 ngx-select-dropdown 事件，下拉列表也不显示。
在添加下拉列表之前：
添加下拉列表后：
商店设置视图page.component.html
<H1 align="center">Store Settings Viewer</H1>
<div><label>Store ID: </label><input type="text" aria-label="Store ID"></div>
<label>Store ID: </label>
<div class="col s12 l6">
<ngx-select-dropdown tabindex="0" (change)="changeValue($event)" [multiple]="true" [(ngModel)]="storeSelection"
[config]="storeIDDropdownConfig" [options]="stores"></ngx-select-dropdown>
</div>
<div>
<label>MIR Program: </label>
<select [(ngModel)]="mirProgram">
<option value="missed quote">Missed quote</option>
<option value="minutes over">Minutes Over</option>
</select>
</div>
<div>
....
商店设置视图页面组件.ts
import { Component, OnInit } from '@angular/core';
import {SelectDropDownModule} from "ngx-select-dropdown";
import {FormBuilder, FormGroup, Validators} from "@angular/forms";
@Component({
selector: 'app-store-settings-view-page',
templateUrl: './store-settings-view-page.component.html',
styleUrls: ['./store-settings-view-page.component.css']
})
export class StoreSettingsViewPageComponent implements OnInit {
stores:any =[
{
storeID:"1",
mirOptIn:"true",
smsOptIn:"true",
pushOptIn:"true",
loyaltyOptIn:"true",
mirProgram:"minutes over",
missQuoteTimePromo:"Free Large Pizza",
minutesOverPromo:"Free Large Pizza",
minutesOver:"10"
}, {
storeID:"2",
mirOptIn:"true",
smsOptIn:"true",
pushOptIn:"true",
loyaltyOptIn:"true",
mirProgram:"minutes over",
missQuoteTimePromo:"Free Large Pizza",
minutesOverPromo:"Free Large Pizza",
minutesOver:"12"
}
];
storeSelection: any = [];
storeIDDropdownConfig = {search: true, displayKey: 'storeID', limitTo: 3};
mirProgram: any = "minutes over";
data: string[]=["1","2","3"];
constructor() {
}
ngOnInit(): void {
}
search() {
}
changeValue($event: any) {
}
}