Angular PrimeNG 下拉菜单：加载时选择的设置值

Question

我的仪表板页面上的应用程序中有 PrimeNG 下拉菜单。现在我希望当仪表板页面加载时它应该选择值。它应该选择当前财政年度。但现在还不能工作。代码如下

ts 文件代码：

    export class WelcomeComponent implements OnInit, OnDestroy {
  financialYears: any;
  selectedYear = null;

   isReady: boolean | undefined;
  constructor() {
  }

  ngOnInit() {

    this.financialYears = [
      { "name": '2022-23', "code": '2022-2023' },
      { "name": '2023-24', "code": '2023-2024' },
      { "name": '2024-25', "code": '2024-2025' },
      { "name": '2025-26', "code": '2025-2026' },
      { "name": '2026-27', "code": '2026-2027' },
      { "name": '2027-28', "code": '2027-2028' },
      { "name": '2028-29', "code": '2028-2029' },
      { "name": '2029-30', "code": '2029-2030' }
    ];

    this.load();
  }

  load() {
    let currentDate: Date = new Date();

    let fyYear = currentDate.getMonth() >= 4 ? (currentDate.getFullYear() + "-" + (currentDate.getFullYear() + 1)) : ((currentDate.getFullYear() - 1) + "-" + currentDate.getFullYear())
    debugger;
    this.selectedYear = this.financialYears.find((o: { code: string; }) => o.code == fyYear);
    this.isReady = true;
    //this.selectedYear = slY;
  }
}

html文件代码

<p-dropdown [options]="financialYears" [(ngModel)]="selectedYear"  *ngIf="isReady" optionLabel="name" optionValue="code" (onChange)="onChange($event)"></p-dropdown>

但这不起作用。还有其他方式设置选择吗？

Answer 1

因为你有

optionValue="code"

，但你正在修补整个对象，这就是它没有被修补的原因。

请尝试这样：

load() {
    let currentDate: Date = new Date();

    let fyYear = currentDate.getMonth() >= 4 ? (currentDate.getFullYear() + "-" + (currentDate.getFullYear() + 1)) : ((currentDate.getFullYear() - 1) + "-" + currentDate.getFullYear())
    debugger;
    this.selectedYear = this.financialYears.find((o: { code: string; }) => o.code == fyYear).code;
    this.isReady = true;
    //this.selectedYear = slY;
  }