siemens / ix

Siemens Industrial Experience is a design system for designers and developers, to consistently create the perfect digital experience for industrial software products.
https://ix.siemens.io/
MIT License
194 stars 64 forks source link

ix-select #1425

Open pkCrazy opened 1 month ago

pkCrazy commented 1 month ago

Prerequisites

What happened?

ix-select does not show the selected value when items are set dynamically.

image

As you can see 'item 1' gets selected but ix-select itself still shows 'Select an option'.

I expect that ix-select shows 'item 1' instead of 'Select an option'.

What type of frontend framework are you seeing the problem on?

Angular

Which version of iX do you use?

2.4.1

Code to produce this issue.

import { Component } from '@angular/core';
import { map, Subject, timer } from 'rxjs';

@Component({
  selector: 'app-root',
  template: `
    <ix-select [value]="selectedValue">
      <ix-select-item *ngFor="let value of values$ | async"
        [label]="value"
        [value]="value"
        [selected]="value === selectedValue"
      />
    </ix-select>
  `,
  styleUrl: './app.component.css'
})
export class AppComponent {
  selectedValue = ''

  values$ = new Subject<string[]>()

  valuesChange = this.values$.subscribe(values => this.selectedValue = values[0])

  subscription = timer(2000).pipe(
    map(() => ['item 1', 'item 2', 'item 3']),
  ).subscribe(this.values$)
}
github-actions[bot] commented 3 weeks ago

🤖 Hello @pkCrazy

Your issue will be analyzed and is part of our internal workflow. To get informed about our workflow please checkout the Contributing Guidelines

JIRA: IX-1622