Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

282
Visualizações
How check for changes in select menu in Angular?

How do know using openedChange that when you close or open the mat select panel it will show if there is an item on the select box that was check or uncheck.

Right now I can only detect if it is open or close , I wanna to detect that when I close it if there is any activity or select items on the select menu. Thanks.

I want to check if there are any changes.

#html code

 <mat-form-field class="job-filter" appearance="fill">
          <mat-select #select [formControl]="marketDropdownMultiCtrl" placeholder="Market" [multiple]="true" #marketDropdownMultiSelect (openedChange)="changeFilterEvent($event,select)">
              <mat-option>
                <ngx-mat-select-search 
                [showToggleAllCheckbox]="true" 
                accesskey="" 
                placeholderLabel="Search Market filter" 
                noEntriesFoundLabel="'No results found'" 
                (toggleAll)="toggleSelectAllMarket($event)" 
                [toogleAllCheckboxTooltipPosition]="'above'"
                [toggleAllCheckboxChecked]="marketDropdownMultiCtrl?.value?.length === marketDropdownSize" 
                [toggleAllCheckboxIndeterminate]="marketDropdownMultiCtrl?.value?.length > 0 && marketDropdownMultiCtrl?.value?.length < marketDropdownSize"
                [toggleAllCheckboxTooltipMessage]="'Select / Deselect all Market filters'" 
                [formControl]="marketDropdownMultiFilterCtrl">
              </ngx-mat-select-search>
              </mat-option>
              <mat-option *ngFor="let market of filteredMarketListMulti | async" [value]="market">
                  {{market.description}}
              </mat-option>
          </mat-select>
        </mat-form-field>

enter image description here

#tscode

changeFilterEvent(opened:boolean,element:any){ }
about 4 years ago · Juan Pablo Isaza
1 Respostas
Responde à pergunta

0

Before open make a copy of marketDropdownMultiCtrl.value -

this.oldValue=marketDropdownMultiCtrl.value

After close compare values

if (marketDropdownMultiCtrl.value!=this.oldValues)
        ...do something..
})

if you want check any change in the same time you check/uncheck any value you can also subscribe to this.marketDropdownMultiCtrl.valueChanges using pipe pairwise

ngOnInit()
{
   this.marketDropdownMultiCtrl=new FormControl(null);
 
   this.marketDropdownMultiCtrl.valueChanges.pipe(
      //it's necesary send a first value
      startWith(this.marketDropdownMultiCtrl.value), 
      pairwise())  //the pairwise make the "magic"
       .subscribe(([old,value])=>{
          if (old!=value)
          {
              console.log("I change from "+old+" to "+value)
          }
      })
about 4 years ago · Juan Pablo Isaza Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda