首页 > 解决方案 > PrimeNG DropDown 占位符在刷新时无法与翻译一起使用

问题描述

我有一个 PrimeNG 下拉控件,它带有一个使用翻译管道的占位符。当我最初加载视图时,占位符按预期显示。但是,当我刷新页面时,下拉菜单始终显示选择第一个选项的下拉菜单。我试图将翻译移动到代码中并通过数据绑定使用变量,但在这种情况下,占位符将仅显示翻译标签。唯一有效的是不使用任何翻译。在这种情况下,即使在页面刷新后也会显示占位符。

HTML:

<p-dropdown [options]="myOptions" [(ngModel)]="option" placeholder="{{ 'LABEL' | translate }}" optionLabel="name"></p-dropdown>

角度:

myOptions: MyOptions[];
option: string;

ngOnInit(): void { 
 this.myOptions:  = [
  { name: 'options1' },
  { name: 'option2' },
  { name: 'option3' }
];

标签: angularprimengngx-translate

解决方案


尝试将autoDisplayFirst选项设置为false,以防止这种行为,因为下拉菜单可能会在获得正确翻译之前被初始化。

自动显示优先:

如果未定义占位符且值为 null,是否将第一项显示为标签。


推荐阅读