Question

我正在尝试实现下面的自定义管道

@Pipe({
   name: 'imagePipe'
})

@Injectable()
export class ImagePipe {
  constructor(public someService: SomeService, public storage: Storage) {
} 

  transform(value: any, arg: any) {
     if ((value != null) && (value!=arg)){
            return this.storage.get(value).then((val) => {
                            console.log('Your source is', val);

                })
    }
  }
}

此管道的目的是在存储中搜索值并设置图像的URL。我正在应用它如下：

<img src="{{info.title | imagePipe : otherTitle | async}}" width="45" height="120"/>

控制台显示一个值，但图像URL为空。

Answer 1

我认为您有2个错误：

     if ((value != null) && (value!=arg)){
        return this.storage.get(value).then((val) => {
                        console.log('Your source is', val);

            })
}

首先，如果它为假，则不返回任何内容！其次，我将在一个“ class var”中加载storage.get并从那里调用它。

Answer 2

解决方案是

@Pipe({
    name: 'imagePipe'
})

@Injectable()
    export class ImagePipe {
        constructor(public someService: SomeService, public storage: Storage) {} 

        transform(value: any, arg: any) {
             if ((value != null) && (value!=arg)){
                  return this.storage.get(value).then((val) => {
                        console.log('Your source is', val);
                        return val;
            })
        }
    }
 }

返回陈述错误

在Typescript中设置来自管道的图像源

2 个答案: