根据选择另一个 p-dropdown PrimeNG 禁用 p-dropdown

Question

我在我的 angular 应用程序中使用 PrimeNG，我对 p-dropdown

有疑问

问题

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

Answer 1

如果我很了解您的需求，您必须在国家/地区下拉列表中设置 onChange 事件。此事件将调用一个方法，该方法将触发 disabled 属性种姓下拉列表，具体取决于国家 selected。如果该国家/地区不是印度，它还将在此下拉列表中 select OPEN 选项。

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;
     }
}

见Plunker

是您要找的吗？

Answer 2

如果您使用的是指令表单控件，您可以通过在表单控件中添加 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)
  });

根据选择另一个 p-dropdown PrimeNG 禁用 p-dropdown

Disable p-dropdown depending selection of another p-dropdown PrimeNG

primeng

primeng-dropdowns

angular5