如何显示与NG-模型输入元素的不同的价值？模型、元素、不同、价值

2023-09-14 23:09:36 作者：你若盛开、蝴蝶自来

在控制器如果有一个跟踪指数的变量页面（从0开始）为分页表：

In the controller if have a variable that tracks the index (starting at 0) of the page for a pagination table:

var page {
  pageNumber: 0;
}

问：我怎么能显示在这个HTML PAGENUMBER 变量，但总是增加+1？（作为指数= 0页面显然是第一页，因此应显示为 1 ）

Question: how can I show this pageNumber variable in the html, but always incremented by +1? (as the index=0 page is obviously the 1st page and should thus be shown as Page 1)

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

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

Also, when the model gets updated, the value in the input should automatically change (again: also incremented by +1).

推荐答案

我觉得这是一个用例为$格式化和$解析器。它们操作上的模型的属性，也没有必要创建模型上的虚拟财产。文档这里。请纠正我，如果不是这种用例$格式化和$解析器。

I think this is a use-case for $formatters and $parsers. They operate on the model's property and there is no need to create a dummy property on the model. Documentation here. Please correct me if this is not the use case for $formatters and $parsers.

请参见下文。

HTML标记

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

var app = angular.module('app', []);

app.controller('mainCtrl', function($scope) {
  $scope.page = 0;
});

app.directive('paginatedIndex', function()
{
    return{
        restrict: 'A',
        require: 'ngModel',
        link: function(scope, element, attrs, ngModelController)
        {
            ngModelController.$formatters.push(function(value)
            {
                return value+1;
            })

            ngModelController.$parsers.push(function(value)
            {
                return value-1;
            })   
        }
    }
});

上一篇：如何有效角的控制器方法化妆$范围，我的函数参数我的、控制器、函数、范围

下一篇：未知提供商：$ uibModalInstanceProvider - 引导UI模式提供商、模式、uibModalInstanceProvider、UI

相关推荐