2017-07-12 16 views
0

私はionicを使用しており、画像データを表すオブジェクトを取得し、その画像へのURLを返すカスタムパイプを作成しました。私は私のパイプをインポートpipesフォルダ内のpipes.module.tsファイルを作成しているパイプ投げのインポートTypescriptプロパティが存在しませんエラー

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

@Pipe({ 
    name: 'eventImageLink', 
}) 
export class EventImageLinkPipe implements PipeTransform { 
    /** 
    * Takes a value and makes it lowercase. 
    */ 
    transform(value: string, ...args) { 
    if(value){ 
     return `//res.cloudinary.com/***/image/upload/w_${window.screen.width},d_item_placeholder_e0lign.jpg/${value.image_version}/${args[0]}/${value.original_image_name}`; 
    } 
    } 
} 

パイプファイルは次のようになります... ...私もインポートする前に、今

import { NgModule } from '@angular/core'; 
import { EventImageLinkPipe } from './event-image-link/event-image-link'; 

@NgModule({ 
    declarations: [ 
    EventImageLinkPipe 
    ], 
    imports: [ 

    ], 
    exports: [ 
    EventImageLinkPipe 
    ] 
}) 
export class PipesModule {} 

PipesModuleを使用するコンポーネントに次のエラーが発生しています...

Typescript Error

プロパティ「するimage_version」タイプ「文字列」に存在しません。

私もまだそれを使用しようとしていないときにこのエラーが来ている理由を私は理解できない、それは実際にはかなり迷惑なんです。誰かがパイプが実行されている理由と、パイプにデータをまだ渡さなかったときにこのエラーが発生しないようにする方法を説明できますか?

答えて

2

さて、あなたは、あなたが将来的にそれの場所に文字列型のオブジェクトを渡すことを意味します入力value: stringを宣言しました。 stringのタイプは、エラーであると言われているimage_versionのプロパティを持っていません。これはエラーであり、コードは単純に機能しません。返品結果の一部としてvalue.image_versionに電話をかけようとしている場合は、valueを適切なタイプに変更する必要があります。

あなたはおそらくそれのためにカスタムクラスを持つことができます:

export class MyImage { 
    image_version: string; 
    original_image_name: string; 
} 

あなたはその後、MyImageクラスの型としてvalue: MyImageを宣言することができ、それは両方のプロパティが含まれているので活字体がそれと罰金になり、stringとは異なりimage_versionoriginal_image_nameをタイプ。

また、何も実行されていない、本当に、それはこのような愚かな過ちをやってからあなたを防ぐだけの活字体の静的型チェック、です。静的タイプの検査機能を使用したくない場合は、タイプを指定しないでvalueと設定することもできます。そうすれば、必要なものを渡すことができ、オブジェクトのタイプが間違っていると実行時にクラッシュします。

+0

私はそれが私が見ていないシンプルなものだと分かっていました。実際にイメージをクラスにすることも良い考えです。同じようにしました。私は 'value:string'を' value:any'に変更して、クラスとオブジェクトを受け入れるようにしました。 – Jordan

関連する問題