我正在尝试显示一个primeng下拉列表,但列表根本不显示。我使用角4.0.2和primeng 4.0.0-rc.3。我确实看到很多报道的问题,并尝试了不同的解决方案,但仍然没有看到ll的下拉列表。
html page
<p-dropdown [options]="archivingGroups"[(ngModel)]="selectedArchivingGroup" ngDefaultControl ></p-dropdown>
组件代码:
import {Component, OnInit} from '@angular/core';
import {FixingTimeService} from './service/fixing-time.service';
import {SelectItem} from 'primeng/primeng';
import {FixingTime} from './service/fixing-time';
@Component({
selector: 'app-fixing-time',
templateUrl: './fixing-time.component.html',
styleUrls: ['./fixing-time.component.css'],
})
export class FixingTimeComponent implements OnInit {
archivingGroups: SelectItem[] = [];
selectedArchivingGroup: string;
private _fixingTimes: FixingTime[];
constructor(private _fixingService: FixingTimeService) {
this._fixingService.getAll().subscribe(
fixingTimes => {
this._fixingTimes = fixingTimes;
this.setCurrencyPair('USD/TH1');
},
error => console.log(error)
);
}
ngOnInit() {
// this._fixingService.getAll().subscribe(
// fixingTimes => {
// this._fixingTimes = fixingTimes;
// this.setCurrencyPair('USD/TH1');
// },
// error => console.log(error)
// );
}
onchange() {
console.log('FixingTime onChange()');
}
private setCurrencyPair(currencyPair: string): void {
this.archivingGroups.push({label: 'select archiving group', value: null});
for (let item of this._fixingTimes) {
if (item.contract === currencyPair) {
this.archivingGroups.push({label: item.archiving_group, value: item});
}
}
}
}
这是我的package.json
{
"name": "sales-desktop",
"version": "0.0.93-SNAPSHOT.0",
"license": "MIT",
"angular-cli": {},
"scripts": {
"build": "ng build",
"start dev-stubbed": "ng serve --env=dev-stubbed",
"start dev-localhost": "ng serve --env=dev-localhost",
"lint": "ng lint",
"test": "ng test",
"test with coverage": "ng test --code-coverage",
"coverage": "rimraf coverage && ng test --browsers PhantomJS --code-coverage true --singleRun true",
"coverage chrome": "rimraf coverage && ng test --browsers Chrome --code-coverage true --singleRun true",
"continuous coverage": "rimraf coverage && ng test --browsers PhantomJS --code-coverage true",
"test chrome": "ng test --browsers Chrome",
"test phantomjs once": "ng test --browsers PhantomJS --singleRun true",
"pree2e": "webdriver-manager --proxy http://gblproxy.lb.service.anz:80 update --ignore_ssl=true",
"e2e": "ng e2e",
"protractor elementExplorer": "protractor --elementExplorer",
"compile dynamic": "ng build --env=dynamic",
"compile": "ng build"
},
"private": true,
"dependencies": {
"@angular/animations": "^4.0.2",
"@angular/common": "^4.0.2",
"@angular/compiler": "^4.0.2",
"@angular/compiler-cli": "^4.0.2",
"@angular/core": "^4.0.2",
"@angular/forms": "^4.0.2",
"@angular/http": "^4.0.2",
"@angular/platform-browser": "^4.0.2",
"@angular/platform-browser-dynamic": "^4.0.2",
"@angular/router": "^4.0.2",
"@types/jasmine": "^2.5.47",
"@types/node": "^6.0.70",
"angular2-moment": "^1.2.0",
"chart.js": "^2.5.0",
"classlist.js": "^1.1.20150312",
"core-js": "^2.4.1",
"fullcalendar": "^3.3.1",
"intl": "^1.2.5",
"jquery": "^3.1.1",
"js-joda": "^1.5.1",
"karma": "^1.6.0",
"karma-coverage-istanbul-reporter": "^1.2.0",
"moment": "^2.17.1",
"nanoscroller": "^0.8.7",
"primeng": "^4.0.0-rc.3",
"quill": "^1.2.4",
"rxjs": "^5.3.0",
"ts-node": "^2.1.2",
"typescript": "^2.3.0",
"web-animations-js": "^2.2.4",
"zone.js": "^0.8.5"
},
"devDependencies": {
"@angular/cli": "^1.0.0-rc.2",
"@angular/compiler-cli": "^4.0.0",
"@types/jasmine": "^2.5.38",
"@types/node": "^6.0.60",
"codelyzer": "^2.1.1",
"jasmine-core": "~2.5.2",
"jasmine-spec-reporter": "^4.0.0",
"karma-chrome-launcher": "~2.0.0",
"karma-cli": "^1.0.1",
"karma-fixture": "^0.2.6",
"karma-html2js-preprocessor": "^1.1.0",
"karma-jasmine": "^1.1.0",
"karma-jasmine-html-reporter": "^0.2.2",
"karma-json-fixtures-preprocessor": "^0.0.6",
"karma-phantomjs-launcher": "^1.0.4",
"protractor": "^5.1.0",
"tslint": "^4.5.1",
"typescript": "^2.1.0",
"typescript-collections": "^1.2.3"
}
}
答案 0 :(得分:1)
您是否导入了下拉模块?
import { DropdownModule } from 'primeng/primeng';