0
我正在嘗試使用Angular 2創建一個簡單的應用程序,並且在使用Pipe裝飾器時遇到問題。我正在使用Pipe來訪問數據值,這在Angular 1中可以非常輕鬆地完成。爲了使用PIPE實現這個功能,我幾乎複製了template發佈在相關的SO question中,但我的app.module.ts
除外。app.module.ts找不到管道名稱
ERROR in /Users/me/thisapp/mybio/src/app/app.module.ts (20,5): Cannot find name 'KeysPipe'.)
我試圖複製管道的名字在我的app.module.ts
聲明,但這並沒有解決問題。總的來說,我很迷惑Component,Module和pipe.ts文件如何交互。如果能夠解釋問題,我將不勝感激。
app.module.ts
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import { Pipe, PipeTransform } from '@angular/core';
import { routes } from './app.router';
import { AppComponent } from './app.component';
import { AppResumeComponent } from './app-resume/app-resume.component';
import { EducationComponent } from './education/education.component';
import { WorkxpComponent } from './workxp/workxp.component';
import { LaughComponent } from './laugh/laugh.component';
@NgModule({
declarations: [
AppComponent,
AppResumeComponent,
EducationComponent,
WorkxpComponent,
LaughComponent,
KeysPipe
],
imports: [
BrowserModule,
FormsModule,
HttpModule,
routes
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
pipe.ts
@Pipe({name:'keys'})
export class KeysPipe implements PipeTransform {
transform(value,args:string[]) : any {
let keys = [];
for (let key in value){
keys.push({key: key, value: value[key]});
}
return keys
}
}
laugh.component.ts
import {Component, Pipe, PipeTransform} from '@angular/core';
import {KeysPipe} from './pipe'
@Component({
selector: 'my-app',
templateUrl: 'laugh.component.html',
})
export class LaughComponent {
demo = {
'key1': 'ANGULAR 2',
'key2': 'Pardeep',
'key3': 'Jain',
}
}
謝謝!從'@ angular/core';'到'pipe.ts':'管道未定義'添加'import {Component,Pipe,PipeTransform}後出現另一個錯誤。你知道這是什麼原因嗎? – st4rgut
從'@ angular/core'導入{Pipe};它應該工作,嘗試改變你的管道到另一個名字 – Sajeetharan