(Жасмин) Как программно выбрать / передать значение <select>тег и вызвать событие изменения в Angular 4? - PullRequest
Новая
       32

(Жасмин) Как программно выбрать / передать значение <select>тег и вызвать событие изменения в Angular 4?

0 голосов
/ 12 марта 2019

Я работаю над угловым приложением и использую Jasmine для его модульного тестирования.Я новичок в Jasmine.

Я хочу проверить тег <select> для события (изменения), и событие изменения срабатывает, когда пользователь выбирает значение из раскрывающегося списка.

проверяемый код: 

// template
<select class="selectTerminal"(change)="onChangeTerminal($event.target.value)">
  <option value="" disabled>Select Terminal</option>
  <option *ngFor="let terminal of terminalList" [value]="terminal.id">{{terminal.terminalCode}}</option>
</select>

//function called when the change event is triggered.
onChangeTerminal(id) {

  // `id` comes as `undefined` upon `ng test`, but works fine with `ng serve` since the value is selected manually from the dropdown list.
  this.terminalId = id; 
  this.wharfService.getWharfOrderByTerminalId(id).subscribe(res => {
  }, (error) => {
    // handle error
  });
}

, что я до сих пор могу сделать, это вызвать событие изменения так, что функция вызывается.Но я не могу программно выбрать / передать значение, которое должно быть передано в качестве аргументов методу, который получает идентификатор при выборе значения из раскрывающегося списка.

Как установить значениеопций выбора до запуска события изменения?

1 Ответ

0 голосов
/ 13 марта 2019

Пожалуйста, попробуйте следующий код. Он должен вызывать функцию onChange автоматически всякий раз, когда значение модели изменяется 

 // template
    <select class="selectTerminal"(change)="onChangeTerminal($event.target.value)" [(ngModel)]="selectedTerminal">
      <option value="" disabled>Select Terminal</option>
      <option *ngFor="let terminal of terminalList" [value]="terminal.id">{{terminal.terminalCode}}</option>
    </select>

    ngOnInit(){
        this.selectedTerminal = 'defaultTerminal';
    }
    //function called when the change event is triggered.
    onChangeTerminal(id) {

      // `id` comes as `undefined` upon `ng test`, but works fine with `ng serve` since the value is selected manually from the dropdown list.
      this.terminalId = id; 
      this.wharfService.getWharfOrderByTerminalId(id).subscribe(res => {
      }, (error) => {
        // handle error
      });
    }
...