Question

在控制器中，如果有一个变量跟踪分页表的页面索引（从0开始）：

var page {
  pageNumber: 0;
}

问题：如何在html中显示此pageNumber变量，但总是增加+1？（因为索引= 0页显然是第1页，因此应显示为Page 1）

<input type="text" ng-model="page.pageNumber">

此外，当模型更新时，输入中的值应自动更改（再次：也增加+1）。

Answer 1

我认为这是$ formatters和$ parsers的用例。它们在模型的属性上运行，不需要在模型上创建虚拟属性。文档here。如果这不是$ formatters和$ parsers的用例，请纠正我。

请参阅下文。

HTML标记

/\[[1-9]\d*\] records failed/

<强> JS

<body ng-app="app" ng-controller="mainCtrl">   
   {{page}}
   <input paginated-index type="text" ng-model="page">   
</body>

Answer 2

在您的控制器中，将您的页面对象更改为：

$scope.page = {
  displayedPage: function(num) {
    if(arguments.length) {
       $scope.page.pageNumber = num - 1;
       return num;
    } else {
      return $scope.page.pageNumber + 1;
    }
  },
  pageNumber: 0
}

然后你对此有所了解：

<input type="text" ng-model="page.displayedPage" ng-model-options="{ getterSetter: true}" />

这将显示页码加1，但保留实际的page.pageNumber变量。

我添加的getterSetter: true选项会将模型绑定到getter / setter函数，该函数允许您传入参数 - 在本例中为输入的页码 - 并从该函数返回。您可以在ngModel

的文档中阅读有关此内容的更多信息

Answer 3

你可以尝试使用这样的东西。

   $scope.data=$scope.page.pageNumber+1;
   $scope.fuc=function(){
      $scope.page.pageNumber=$scope.data-1;

   };

，你的Html就像

    <input type="text"  ng-model="data" ng-change="fuc()" >

检查此插件Plunker

如何用ng-model显示输入元素的不同值？

3 个答案: