使用本地脚本转换器 [英] Using nativescript converters

问题描述

我现在正试图用javascript吸引我的nativescript，并有一个非常基本的问题:

Im just now trying to get my hooks into nativescript with javascript and have a very basic question:

    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标签上每个销售价格的价格旁边添加一个$.使用以下方法渲染列表视图:

In the above code, I define the cost formatter I just want a $ to be added beside the price on every sale price on my listview labels. To render the list view Im using:

<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

对于我的本机脚本终端中的列表视图中的每一行.我在做什么错了?

for each row in my listview in my nativescript terminal. What am I doing wrong?

推荐答案

似乎您正在尝试创建所谓的管道".

It seems you're trying to create a so-called 'pipe'.

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

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

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

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

Then make sure you add CostFormatterPipe to the Declarations array of the module you want to use it in.

这篇关于使用本地脚本转换器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！