角型铸件不工作



代码:

<ion-col col-6 *ngFor="let item of items;">
    <ion-card>
        <div class="image_area">
        </div>
      <ion-card-content>
        <ion-card-title class="capitalize">
          {{item.English_name.toLowerCase()}}
        </ion-card-title>
        <ion-grid>
            <ion-row>
                <ion-col>
                    <h4>Rate</h4>
                    <P>{{ parseFloat(item.Rate).toFixed(2) }}</P>
                </ion-col>
                <ion-col>
                    <h4>MRP</h4>
                    <P>{{ parseFloat(item.MRP_rate).toFixed(2) }}</P>
                </ion-col>
            </ion-row>
        </ion-grid>
        <button ion-button full color="primary">Add to cart</button>
      </ion-card-content>
    </ion-card>
</ion-col>

任何人都可以告诉我为什么parseFloat不起作用如何使其可行?我正在使用ngFor loop,所以在控制器中做parseFloat和toDixed是个坏主意。

你能试试下面的代码吗

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<body>
<div ng-app="myApp" ng-controller="myCtrl">
{{ (item.Rate).toFixed(2) }}<br/>
{{ (item.MRP_rate).toFixed(2) }}
</div>
<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
    $scope.name = "John Doe";
	
	$scope.item = { Rate: 12.1233,MRP_rate: 52.12222}
});
</script>
</body>
</html>

问题是你不能只从模板中调用你想要的任何函数。

只能调用在组件上声明的函数。

因此,2个解决方案:

  1. 计算组件中的费率和物料需求计划,例如:

    items = items.map((i: any) => ({...i, parsed_rate: parseFloat(i.Rate).toFixed(2), parsed_MRP: parseFloat(i.MRP_rate).toFixed(2)}));
    

    稍后在模板中使用 {{ item.parsed_rate }} 和 {{ item.parsed_MRP }}。

  2. 在组件中定义一个解析函数(您也可以使用管道(并从模板调用它

    parseRateAndMRP(s: String) { return parseFloat(s).toFixed(2); }
    

    稍后使用 {{ parseRateAndMRP(item.Rate( }} 和 {{ parseRateAndMRP(item.模板中的 MRP_rate( }}

app.controller('myCtrl', function($scope) {
    $scope.item = { Rate: 12.1233,MRP_rate: 52.12222}
    $scope.itemtoparse =  parseFloat($scope.item.rate).toFixed(2)
}

{{itemtoparse}}尝试提交到界面之前执行此操作

在控制器内完成

相关内容

  • 没有找到相关文章

最新更新