如何计算大括号中的 angular 变量

Question

我有这个代码：

    <pre>totalItems: {{vm.pagination.totalItems}}</pre>
    <pre>items-per-page: {{vm.pagination.itemsPerPage}}</pre>
    <pre>Total: Math.ceil({{vm.pagination.totalItems / vm.pagination.itemsPerPage}})</pre>

输出：

我正在使用 Math.ceil() 所以答案应该是 11 但我没有得到如下正确答案：

如何计算大括号中的 angular 值？请帮助并提前致谢。

Answer 1

最好的方法是创建一个作用域函数：

<pre>Total: {{calculateTotal(vm.pagination.totalItems, vm.pagination.itemsPerPage)}}</pre>

然后将函数添加到作用域中：

$scope.calculateTotal = function(totalItems, itemsPerPage) {
  return Math.ceil(totalItems/itemsPerPage);
};

Answer 2

angular.module('myapp', [])
  .controller('foo', function($scope) {

var vm = this;

vm.w = {
pagination: {
 totalItems: 258,
 itemsPerPage: 25
}
}

init();

return vm.w;

function init() {
 vm.w.pagination.calculation = Math.ceil(vm.w.pagination.totalItems / vm.w.pagination.itemsPerPage)
}

});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<body ng-app="myapp">
<div ng-controller="foo as vm">

 <pre>totalItems: {{vm.pagination.totalItems}}</pre>
    <pre>items-per-page: {{vm.pagination.itemsPerPage}}</pre>
    <pre>Total: {{vm.pagination.calculation}}</pre>


</body>

Answer 3

如果需要在模板中使用Math，则需要将其公开。所以在你的控制器中你会设置

vm.Math = Math;

然后您可以像这样在模板中使用它：

<pre>Total: {{ vm.Math.ceil(vm.pagination.totalItems / vm.pagination.itemsPerPage }})</pre>

但是，与其在模板中进行计算，不如在控制器中公开一个计算值的函数：

vm.getTotalPageCount = function() {
    return Math.ceil(vm.pagination.totalItems / vm.pagination.itemsPerPage);
};

并在您的模板中使用它：

<pre>Total: {{ vm.getTotalPageCount() }})</pre>

如何计算大括号中的 angular 变量

How to calculated angular variable in braces

curly-braces

angularjs