Получить булевы значения параметров - PullRequest
Новая
       25

Получить булевы значения параметров

0 голосов
/ 12 декабря 2018

Я создаю простое приложение для управления клиентами.Одной из функций является фильтрация по таблице, чтобы составить список активных и неактивных клиентов.Моя проблема заключается в том, что при нажатии на раскрывающееся меню я не могу получить логическое значение, то есть true / false, но только строки «true» / «false», следовательно, мой фильтр не будет работать.

Вот мой HTML: 

<strong class="ml-2">Active Status</strong>
<select class="ml-1" name="activeStatus" [(ngModel)]="activeStatus">
  <option></option>
  <option value=true>Active</option>
  <option value=false>Not Active</option>
</select>

Мой фильтр таблицы таблиц: 

import { Pipe, PipeTransform } from '@angular/core';

@Pipe({
  name: 'tableFilters'
})
export class TableFiltersPipe implements PipeTransform {

  transform(list: any[], filters: Object) {
    const keys = Object.keys(filters).filter(key => filters[key]);
    const filterUser = user => keys.every(key => user[key] === filters[key]);
    return keys.length ? list.filter(filterUser) : list;
  }

}

Ответы [ 2 ]

0 голосов
/ 14 декабря 2018

Свойство value элемента HTML option может быть только строкой.Например, эти select опции имеют строковые значения: 

<option value="First">Value 1</option>        // value: "First"
<option [value]="'Second'">Value 2</option>   // value: "Second"
<option [value]="myVar">Value 3</option>      // value: string value of myVar property

Чтобы передать что-либо, кроме строки, в ngModel, когда выбран option, используйте привязку [ngValue].Как упомянуто в ограниченной документации :

@ Input () ngValue: any - Отслеживает значение, привязанное к элементу option.В отличие от привязки значения, ngValue поддерживает привязку к объектам.

@ Input () value: any - отслеживает простые строковые значения, связанные с элементом option.Для объектов используйте входную привязку ngValue.

В вашем случае вы можете использовать [ngValue] для установки логических значений: 

<option [ngValue]="true">Active</option>       // value: true (as boolean)
<option [ngValue]="false">Not Active</option>  // value: false (as boolean)
0 голосов
/ 12 декабря 2018

Боюсь, что-нибудь еще, кроме text, будет взято из HTML option.От MDN для параметра HTML :

Допустимое содержимое: текст, возможно с экранированными символами (например, é).

значение: содержимое этого атрибута представляет собойзначение, которое будет отправлено с формой, если эта опция выбрана.Если этот атрибут опущен, значение берется из текстового содержимого элемента option.

Тогда лучшее, что вы можете сделать, это установить сеттер для activeStatus

_activeStatus

set activeStatus(val) {
  this._activeStatus = val === 'true' ? true : val === 'false' ? false : val;
}

get activeStatus() {
  return this._activeStatus;
}
...