Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

Cannot read property 'trim' of undefined

Olá, estou enfrentando o seguinte problema ao utilizar o método trim() na criacao de um pipe.

Módulo:

import { NgModule } from "@angular/core";
import { HttpClientModule } from "@angular/common/http";
import { CommonModule } from "@angular/common";

import { PhotoComponent } from "./photo/photo.component";
import { PhotoListComponent } from './photo-list/photo-list.component';
import { PhotoFormComponent } from './photo-form/photo-form.component';
import { PhotosComponent } from './photo-list/photos/photos.component';
import { BuscaDaDescricao } from './photo-list/busca-da-descricao.pipe';

@NgModule({
    declarations: [
        PhotoComponent,
        PhotoListComponent,
        PhotoFormComponent,
        PhotosComponent,
        BuscaDaDescricao
    ],
    imports:[
        HttpClientModule,
        CommonModule
    ]
})
export class PhotoModule {  }

Pipe:

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

import { Photo } from "../photo/photos";

@Pipe({
    name: 'buscaDaDescricao'
})
export class BuscaDaDescricao implements PipeTransform {
    /* o primeiro parametro sera o alvo da transformacao, retornando o mesmo tipo do 1° param. */
    transform(photos: Photo[], descriptionQuery: string) {
        descriptionQuery = descriptionQuery
            .trim()// tira os espacos em branco
            .toLocaleLowerCase();    // coloca tudo em minusculo

        /* Incluindo na lista do filter se o que for buscado é igual a  description da foto */
        if (descriptionQuery) {
            photos.filter(photo => 
                photo.description.toLocaleLowerCase().includes(descriptionQuery));
        } else {
            return photos;
        }

    }
}

View:

<div class="text-center mt-3 mb-3">
    <form action="">
        <input class="rounded" type="search" name="" id="" placeholder="Search" autofocus
        (keyup)="buscaNaView = $event.target.value"
        >
    </form>
</div>

<ap-photos [photos]="photos | buscaDaDescricao: busca"></ap-photos>

Ele fala sobre uma propriedade que nao consegue ser lida no método trim(), porem não encontrei nada sobre

1 resposta
solução!

Fala aí Rafael, beleza? Acho que o problema está na variável passada para o pipe, acredito que deva ser buscaNaView ao invés de busca:

Código atual:

<ap-photos [photos]="photos | buscaDaDescricao: busca"></ap-photos>

Mudança:

<ap-photos [photos]="photos | buscaDaDescricao: buscaNaView"></ap-photos>

Espero ter ajudado.