How to disable the other field if the value is pre-selected (primeng multiselet)?

Update: This issue is fixed in primeng version 8.0.2

This is an old already reported issue on which primeng developers has not responded yet. I have created a PR to fix this issue, until the PR is merged or the primeng team comes up with a fix, you can solve it using a ViewChild fix.

The ViewChild fix:

primeng MultiSelect has a property named maxSelectionLimitReached which is set to true when max limit is reached. You have to set it yourself in your ngOnInit. Follow the comments as steps.

import { Component, ViewChild } from '@angular/core';                    // import ViewChild
import { MultiSelect } from 'primeng/multiselect';                       // import MultiSelect


@Component({
  selector: 'app-root',
  templateUrl: './app.component.html'
})
export class AppComponent {
  @ViewChild('dataSelect', { static: true }) dataSelect: MultiSelect;    // declare ViewChild

  data = [];
  cities1 = [
    { label: 'New York', value: 1 },
    { label: 'Rome', value: 2 },
    { label: 'London', value: 3 },
    { label: 'Istanbul', value: 4 },
    { label: 'Paris', value: 5 }
  ];

  ngOnInit() {
    this.data = [4];
    this.dataSelect.maxSelectionLimitReached = this.data.length >= 1;    // Set limit flag
  }
}

Add viewChild identifier to <p-multiSelect> element.

<p-multiSelect #dataSelect [options]="cities1" ... ></p-multiSelect>