Angular 4显示在模板中添加两个数字的结果

Question

我在模板中有以下HTML

<li class="page-item">
    <a [routerLink]=""
       [queryParams]="{page: currentPage+1}"
       class="page-link" href="#">Next
    </a>
</li>

currentPage被定义为我的组件中的number

问题是，如果我在当前页面1上点击它，链接将显示?page=11。如果我在第2页上它显示21，依此类推。

如何将加法结果显示为数字？

Answer 1

在页面2上创建一个函数，将String转换为ts文件中的数字

ConvertToInt(currentPage){
  return parseInt(val);
}

然后调用它

<p>{{ ConvertToInt(currentPage) + ConvertToInt(1) }}</p>

Answer 2

似乎将“currentPage”和“1”都视为字符串，确保“currentPage”实际上是一个数字或字符串。如果没有线索，请尝试调用方法并从组件文件中获取附加值。例如：

<li class="page-item"><a [routerLink]="" [queryParams]="{page: getPageCount()}" class="page-link" href="#">Next </a> </li>