angular - Typescript'te dinamik string dizisinden değerleri al


Angular Material formunda, mat-option içeren bir alanım var ve bu mat-option bir seçenek listesi içeriyor (ör. a, b, c, d, e). Kullanıcı belirli bir seçeneği (ör. c) seçtiğinde veya seçimini kaldırdığında bazı işlemler yapmam gerekiyor. Ama başka hiçbir seçenek seçilmemiş olsa bile 'c' seçeneğini seçtiğimde undefined hatası alıyorum.

Bunu kullandığım indeks değerinden kaynaklandığını anlayabiliyorum. Kullanıcının 'C' seçeneğini seçip seçmediğini nasıl belirleyeceğimden emin değilim çünkü indeks değeri kullanıcı seçimine bağlı olarak dinamik olarak artabilir veya azalabilir.

Yanıt dizisi şöyle görünebilir:

value = {'d','c'} or value = {'c','b','a'} or value = {}

if(value[2] === 'c') {
   console.log('c');
 } 

Biri bana TypeScript kodu yazmamda yardımcı olabilir mi?

Cevap #1

Belki kodunuzda eksik bir şey var. mat-option kullandığınızı söylediğiniz için, ben de bunu kullanarak örnek bir kod oluşturmaya çalıştım.

bileşen.html

<h4>mat select</h4>
<mat-form-field>
  <mat-label>Choose option</mat-label>
  <mat-select [formControl]="optionControl" required (valueChange)="onChange($event)">
    <mat-option>--</mat-option>
    <mat-option *ngFor="let option of options" [value]="option">
      {{option}}
    </mat-option>
  </mat-select>  
</mat-form-field>

<div>
  <p>Selected value</p>
  {{ optionControl.value }}
</div>

bileşen.ts

import {Component} from '@angular/core';
import {FormControl, Validators} from '@angular/forms';

@Component({
  selector: 'app-example',
  templateUrl: 'app-example.html',
  styleUrls: ['app-example.css'],
})
export class AppExampleComponent {
  optionControl = new FormControl('', Validators.required);  
  options = ['a', 'b', 'c']; // this is static but should be dynamic for your case

  onChange(value: string) { // value will be selected option
    if (value === 'c') {
      console.log('c');
    }
  }
}

StackBlitz'teki aksiyona bir göz at

Cevap #2

Bence value={'d','c'} veya value={'c','b','a'} veya value={}, objeler için meşru bir JavaScript/TypeScript sözdizimi değil. Ta ki {c: 'c'} gibi bir şeye atıfta bulunmadıysanız.

Bu durumda bu bir nesnedir ve onu önce bir diziye dönüştürmek için ya Object.keys() ya da Object.values() kullanmanız gerekir.

const value = {
  c: 'c',
  b: 'b',
  a: 'a'
};

if(Object.values(value).includes('c')) {
  console.log('c');
} else {
  console.log('NO c'); 
}