2016-09-12 2 views
0

У меня есть установка поисковой трубы в угловом 2. Поисковая труба работала отлично, когда я был на угловой бета-версии 14, теперь я обновлен до rc5, и поисковая труба сломана, и я получаю ошибку. Если я удаляю трубку из html-кода, то продукт загружается. Это универсальная поисковая и фильтрующая труба и должна использоваться во многих модулях. Пожалуйста, помогите решить проблему.Угловая 2 Труба - Невозможно прочитать свойство 'toString' неопределенного

TypeError: Cannot read property 'toString' of undefined 
at SearchPipe.compareWithAllFields (http://localhost:4200/main.bundle.js:72117:57) 
at Array.filter (native) 
at SearchPipe.transform 

search.pipe.ts

import { Pipe, PipeTransform } from '@angular/core'; 
import {isObject} from "rxjs/util/isObject"; 
import {isEmpty} from "rxjs/operator/isEmpty"; 
import {empty} from "rxjs/Observer"; 
@Pipe({ 
    name: 'search' 
}) 
export class SearchPipe implements PipeTransform 
{ 
    transform(input, [searchString]:Array<String>) 
    { 
     if (input == null) return input; 
     return input.filter(this.compareWithAllFields, searchString); 
    } 

    compareWithAllFields(value, index) 
    { 
     var fields = Object.keys(value); 
     for (let i = 0; i < fields.length; i++) 
     { 
      if (value[fields[i]] != null) 
      { 
       if (isObject(value[fields[i]])) 
       { 
        var childFields = Object.keys(value[fields[i]]); 
        if (childFields.length > 0) 
        { 
         for (let j = 0; j < childFields.length; j++) 
         { 
          if ((value[fields[i]][childFields[j]] + "").indexOf(this.toString()) !== -1) 
          { 
           return true; 
          } 
         } 
        } 
       } 
       if ((value[fields[i]] + "").indexOf(this.toString()) !== -1) 
       { 
        return true; 
       } 
      } 
     } 
     return false; 
    } 
} 

список-products.component.html

<div class="container"> 
    <div class="row"> 
     <div class="col-sm-3 form-group"> 
      <input placeholder="search product" class="form-control" type="text" #searchProduct (keyup)="0"> 
     </div> 
     <div class="col-sm-3 col-sm-offset-6"> 
      <button [routerLink]="['/LoggedIn','Product','ProductAdd']" class="btn btn-lg btn-app">Add Product</button> 
     </div> 
    </div> 
    <div class="row"> 
     <div class="col-sm-12"> 
      <h3>Products</h3> 
      <table class="table table-striped table-bordered"> 
       <thead> 
       <tr> 
        <th>Sr #</th> 
        <th>Name</th> 
        <th>Category</th> 
        <th>Barcode</th> 
        <th>Unit</th> 
        <th>Description</th> 
        <th>Quantity</th> 
        <th>Minimum Stock Level</th> 
        <th>Discount</th> 
        <th>Cost</th> 
        <th>Actions</th> 
       </tr> 
       </thead> 
       <tbody> 
       <tr *ngFor="let product of products | search:searchProduct.value;let serial = index"> 
        <td>{{ serial+1 }}</td> 
        <td>{{ product.name}}</td> 
        <td>{{ product.productCategory.name}}</td> 
        <td>{{ product.barcode}}</td> 
        <td>{{ product.unit?.name}}</td> 
        <td>{{ product.description}}</td> 
        <td>{{ product.quantity}}</td> 
        <td>{{ product.minimumStockLevel}}</td> 
        <td>{{ product.discount}}</td> 
        <td>{{ product.cost}}</td> 
        <td> 
         <button class="btn btn-danger" (click)="delete(product)">Delete</button> 
         <button class="btn btn-default" 
           [routerLink]="['/LoggedIn','Product','ProductEdit',{id:product.id}]">Edit 
         </button> 
        </td> 
       </tr> 
       </tbody> 
      </table> 
     </div> 
    </div> 
</div> 
+1

Что следует 'this.toString()' вернуть? –

+0

@usmanwalana Я думаю, что 'transform (input, [searchString]: Array )' должен быть 'transform (input, searchString)'. – codef0rmer

+1

@ codef0rmer Ваше решение работало как шарм. Большое вам спасибо – usmanwalana

ответ

1

@usmanwalana, ТРУБУ API изменился с RC3/4, теперь он возвращает 2-й параметр в виде строки, а не массив.

Меняем,

transform(input, [searchString]:Array<String>)

в

transform(input, searchString)

0

Я думаю, вам нужно изменить

return input.filter(this.compareWithAllFields, searchString); 

к

return input.filter(this.compareWithAllFields.bind(this), searchString); 
+0

Я пробовал это решение. Ошибка исчезла, но поиск не работал. Решил его, изменив преобразование (input, [searchString]: Array ) для преобразования (input, searchString) – usmanwalana

0

Решение: Изменить transform(input, [searchString]:Array<String>) для transform(input, searchString)

Смежные вопросы