禁用 p 下拉列表,具体取决于选择另一个 p 下拉列表 PrimeNG



>我在我的角度应用程序中使用 PrimeNG,我在 p 下拉菜单方面遇到问题

问题

我有两个国家和caste_category的下拉菜单,我只为印度提供caste_reservation,如果选择其他国家/地区,需要选择caste_category中的 OPEN 选项并禁用该下拉列表。

如果我非常了解您的需求,您必须在国家/地区下拉列表中设置onChange事件。此事件将调用一个方法,该方法将根据所选国家/地区触发种姓下拉列表中disabled属性。如果国家/地区不是印度,它还将在此下拉列表中选择"打开"选项。

.HTML

<p-dropdown [options]="countries" [(ngModel)]="applicant.country" (onChange)="updateCountry()"></p-dropdown>
<p-dropdown [options]="castes" [(ngModel)]="caste" [disabled]="disableCasteDropdown"></p-dropdown>

TS

updateCountry() {
     if(this.applicant.country!=='India') {
       this.disableCasteDropdown = true;
       this.caste = 'o';
     } else {
       this.disableCasteDropdown = false;
       this.caste = null;
     }
}

见普伦克

这是你要找的吗?

如果您使用的是指令表单控件,您可以通过在表单控件中添加 disabled: true 来禁用输入、下拉列表等

在控制台

中对以下消息在 html 中使用禁用属性:

It looks like you're using the disabled attribute with a reactive form directive. If you set disabled to true
  when you set up this control in your component class, the disabled attribute will actually be set in the DOM for
  you. We recommend using this approach to avoid 'changed after checked' errors.
  Example: 
  form = new FormGroup({
    first: new FormControl({value: 'Nancy', disabled: true}, Validators.required),
    last: new FormControl('Drew', Validators.required)
  });

最新更新