javascript - 使用 nativescript 转换器

Question

我刚刚尝试使用 javascript 将我的 hooks 引入 nativescript 并有一个非常基本的问题:

    let costFormatter= {
        toView(value){
            console.log('Got:' + value);
            return '$' + value;
        },
        toModel(value){
            console.log('Got:' + value);
            return '$' + value;
        }
    };
    http.getJSON("<My API Call>").then(function (r){
        page.bindingContext = {
            deals: r,
            costFormatter:costFormatter
        };
    }, function (e){
        //// Argument (e) is Error!
        //console.log(e);
    });

在上面的代码中，我定义了成本格式化程序，我只想在我的 ListView 标签上的每个销售价格的价格旁边添加一个 $。要呈现 ListView ，我使用:

<ListView id="SteamItems" items="{{ deals }}">
                        <ListView.itemTemplate>
                            <GridLayout columns="*, *, 50, 50" rows="50, 50, auto, *">
                                <Image src="{{ thumb }}" row="0" col="0" cssClass="thumb"/>
                                <Label text="{{ title }}" key="1" row="0" col="1" cssClass="title"/>
                                <Label text="{{ normalPrice|costFormatter }}" key="2" row="0" col="2" cssClass="normal-price"/>
                                <Label text="{{ salePrice|costFormatter }}" key="3" row="0" col="3" cssClass="sale-price"/>

                            </GridLayout>

                        </ListView.itemTemplate>
                    </ListView>

我不明白为什么会这样

JS: Cannot find function or filter: costFormatter

对于我的 nativescript 终端中 ListView 中的每一行。我做错了什么？

Answer 1

看来您正在尝试创建一个所谓的“管道”。

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

@Pipe({
  name: 'costFormatter',
  pure: true
})

export class CostFormatterPipe implements PipeTransform {
  transform(price: string): string {
    return "$ " + price;
  }
}

然后确保将 CostFormatterPipe 添加到要在其中使用它的模块的 Declarations 数组。