Angular: труба для поиска объекта по строкам таблицы - PullRequest
Новая
       7

Angular: труба для поиска объекта по строкам таблицы

0 голосов
/ 30 августа 2018

У меня есть канал для поиска объекта по строкам таблицы. JSON для этого 

[
  {
     device:{
               DeviceHostName: "Device_5_0_1_21",
               DeviceIPAddress: "5.0.1.21",
               DeviceId:"44"
            },
     selected:false
  },
  {
     device:{
               DeviceHostName: "Device_5_0_1_21",
               DeviceIPAddress: "5.0.1.21",
               DeviceId:"44"
            },
     selected:false
  }
}

труба 

@Pipe({
  name: 'dashboardPipe'
})
export class DashboardPipe implements PipeTransform {
    public transform(value, filterBy: string) {
        filterBy = filterBy ? filterBy.toLocaleLowerCase() : null;
        return filterBy ? value.filter((row) => {
          (row.device.DeviceHostName + row.device.DeviceIPAddress + 
            row.device.DeviceId + row.device.DeviceOS +
            row.device.DeviceProductFamily)
          .toLocaleLowerCase().indexOf(filterBy) !== -1}) : value;
      }
}

HTML 

<tbody>
    <tr *ngFor="let row of devicesData|dashboardPipe:listFilter; let n=index">
        <td>
            <label class="checkbox">
                <input type="checkbox" name="rowSelection" class="checker" [(ngModel)]="row.selected">
                <span class="checkbox__input"></span>
            </label>
        </td>
        <td>{{row.device.DeviceId}}</td>
        <td>{{row.device.DeviceHostName}}</td>
        <td>{{row.device.DeviceIPAddress}}</td>    
     </tr>
</tbody>

Pipe работает абсолютно нормально и отображает результаты фильтра поиска, если я использую приведенный ниже JSON, то есть просто массив объектов со значениями ключей 

[
  {
     DeviceHostName: "Device_5_0_1_21",
     DeviceIPAddress: "5.0.1.21",
     DeviceId:"44",
     selected:false 
  },
  {
     DeviceHostName: "Device_5_1_1_47",
     DeviceIPAddress: "5.1.1.47",
     DeviceId:"45",
     selected:false     
  }
]

Даже если я прохожу row.device. в логике канала его не фильтрует значения в пользовательском интерфейсе. Куда я иду не так?

...