角管

Question

我在angular4中使用管道。它在本地服务器上工作正常。但是当我使用命令ng build --prod时，则显示错误。 错误：类型“ HomeComponent”上不存在属性searchText。 这是我的代码。

home.component.html

 <input [(ngModel)]="searchText" placeholder="search text goes here">
<ul>
  <li *ngFor="let c of characters | filter : searchText">
{{c}}
</li>
</ul>

home.component.ts

import { Component, OnInit } from '@angular/core';
import {FilterPipe} from '../filter.pipe';

@Component({
selector: 'app-about',
templateUrl: './about.component.html',
styleUrls: ['./about.component.css']
})
export class AboutComponent implements OnInit {
 characters = [
"london",
"USA",
"Paris"
 ]
constructor() { }

 ngOnInit() {
  }

 }

filter.pipe.ts

import { Pipe, PipeTransform } from '@angular/core';
@Pipe({
name: 'filter'
 })
export class FilterPipe implements PipeTransform {
transform(items: any[], searchText: string): any[] {
if(!items) return [];
if(!searchText) return items;
searchText = searchText.toLowerCase();
return items.filter( it => {
  return it.toLowerCase().includes(searchText);
  });
  }
 }

app.module.ts

 import { BrowserModule } from '@angular/platform-browser';
 import { NgModule } from '@angular/core';
 import { FormsModule } from '@angular/forms';
 import {RouterModule,Routes} from '@angular/router';
 import { AppComponent } from './app.component';
 import { HomeComponent } from './home/home.component';
 import { FilterPipe } from './filter.pipe';


@NgModule({
 declarations: [
 AppComponent,
 HomeComponent,
 FilterPipe
],
 imports: [
  BrowserModule,
  FormsModule,
  RouterModule.forRoot([
  {path:'home',component:HomeComponent},
  {path:'',redirectTo:'home',pathMatch:'full'},
   ])
 ],
 providers: [],
 bootstrap: [AppComponent]
  })

 export class AppModule { }

Answer 1

没有变量名 您的home.component.ts ts文件

中的searchText

因此在您的ts文件中添加

searchText: string;