如何在angularjs表达式中将字符串转换为数字或日期

用户名

我正在使用angularjs制作事物的分页类型,比如说我有一个2D数组,并且正在显示其中的值。它的工作正常,但我也想能够编辑这些值,所以我在输入标记中使用了ng-hide,它的工作正常,但问题是,如果输入的类型是数字或日期,而我的数组值的类型是字符串则这些值不会显示在可编辑的输入框中。

代码:

<table class="table table-hover">
            <thead>
                <tr class="active">
                    <th class="id">Label</th>
                    <th class="name">Field</th>
                </tr>
            </thead>

            <tbody>
                <tr ng-repeat="item in fieldsonPage[currentPage]" class="active">
                    <td>{{item}}</td>
                    <td>
                        <div ng-repeat="prop in pagedItems[currentPage]" class="active">
                                <div ng-hide="ngEditName" ng-click="ngEditName=!ngEditName">
                                    {{prop[item]}}
                                </div>
                                <div ng-show="ngEditName">                                                    
                                    <input type="{{fieldsType[item]}}" ng-hide="{{fieldsType[item] == 'textarea' ? 'true' : 'false'}}" ng-model="prop[item]" class="form-control"/>
                                    <textarea rows="4" cols="50" ng-hide="{{fieldsType[item] == 'textarea' ? 'false' : 'true'}}" class="form-control" ng-model="prop[item]" /><div ng-click="ngEditName=!ngEditName">Close</div> 
                                </div>
                        </div>
                    </td>
                </tr>
            </tbody>
        </table>

类型取决于正在工作的关联数据的类型,但是绑定不合适,因此我需要一种将字符串转换为html页面本身表达式中的数字或日期的方法任何线索!在此处输入图片说明

疯狂

This way uses a directive to automagically converts numbers to string and viceversa. I mean using an input element type=number binded to a string variable.

This is done by using, $formatters and $parsers.

app.directive('numberConverter', function() {
  return {
    priority: 1,
    restrict: 'A',
    require: 'ngModel',
    link: function(scope, element, attr, ngModel) {
      function toModel(value) {
        return "" + value; // convert to string
      }

      function toView(value) {
        return parseInt(value); // convert to number
      }

      ngModel.$formatters.push(toView);
      ngModel.$parsers.push(toModel);
    }
  };
});

HTML

 <input type="number" number-converter ng-model="model.number">

More Information:

ngModel.$formatters

Array of functions to execute, as a pipeline, whenever the model value changes. Each function is called, in turn, passing the value through to the next. Used to format / convert values for display in the control and validation.

ngModel.$parsers

每当控件从DOM读取值时,作为管道执行的函数数组。依次调用每个函数,将值传递给下一个。最后的返回值用于填充模型。用于清除/转换值以及进行验证。为了进行验证,解析器应使用$ setValidity()更新有效性状态,并为无效值返回undefined。

朋克

源文档:https : //docs.angularjs.org/api/ng/type/ngModel.NgModelController

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

如何在Lazor C#中将lambda表达式的结果转换为字符串?

来自分类Dev

如何在Linq表达式中将字符串转换为TimeSpan?

来自分类Dev

如何在Lazor C#中将lambda表达式的结果转换为字符串?

来自分类Dev

在java中将字符串转换为表达式

来自分类Dev

如何在coffeescript中将数字转换为字符串?

来自分类Dev

如何在MySQL中将字符串转换为数字?

来自分类Dev

如何在netezza中将字符串转换为数字

来自分类Dev

如何在JavaScript中将日期转换为字符串?

来自分类Dev

如何在Mulesoft中将字符串转换为日期?

来自分类Dev

如何在JavaScript中将日期转换为字符串?

来自分类Dev

如何在excel中将字符串转换为日期?

来自分类Dev

在javascript中将正则表达式字符串转换为正则表达式对象

来自分类Dev

MarkLogic:在cts:search中将字符串转换为路径表达式

来自分类Dev

C#在表达式中将字符串转换为int

来自分类Dev

将查询参数字符串转换为正则表达式

来自分类Dev

正则表达式将字符串数字转换为货币

来自分类Dev

正则表达式字符串,转换为数字并匹配条件

来自分类Dev

使用正则表达式将数字转换为特定字符串

来自分类Dev

伪数组的自动热键变量表达式 - 将字符串转换为数字?

来自分类Dev

Linq表达式转换为字符串

来自分类Dev

将NCalc表达式转换为字符串

来自分类Dev

将字符串转换为 SymPy 表达式?

来自分类Dev

Perl正则表达式:如何在不带\“的情况下将字符串从”转换为“?

来自分类Dev

在dhtmlxScheduler和AngularJS中将日期转换为字符串

来自分类Dev

如何在Google表格中将“ +”字符转换为REGEXMATCH的正则表达式?

来自分类Dev

如何在PHP中将字符串转换为日期或日期时间

来自分类Dev

如何在pyspark中将日期时间从字符串格式转换为日期时间格式?

来自分类Dev

如何在PHP中将字符串转换为日期或日期时间

来自分类Dev

如何在MySQL中将日期从日期转换为字符串?

Related 相关文章

  1. 1

    如何在Lazor C#中将lambda表达式的结果转换为字符串?

  2. 2

    如何在Linq表达式中将字符串转换为TimeSpan?

  3. 3

    如何在Lazor C#中将lambda表达式的结果转换为字符串?

  4. 4

    在java中将字符串转换为表达式

  5. 5

    如何在coffeescript中将数字转换为字符串?

  6. 6

    如何在MySQL中将字符串转换为数字?

  7. 7

    如何在netezza中将字符串转换为数字

  8. 8

    如何在JavaScript中将日期转换为字符串?

  9. 9

    如何在Mulesoft中将字符串转换为日期?

  10. 10

    如何在JavaScript中将日期转换为字符串?

  11. 11

    如何在excel中将字符串转换为日期?

  12. 12

    在javascript中将正则表达式字符串转换为正则表达式对象

  13. 13

    MarkLogic:在cts:search中将字符串转换为路径表达式

  14. 14

    C#在表达式中将字符串转换为int

  15. 15

    将查询参数字符串转换为正则表达式

  16. 16

    正则表达式将字符串数字转换为货币

  17. 17

    正则表达式字符串,转换为数字并匹配条件

  18. 18

    使用正则表达式将数字转换为特定字符串

  19. 19

    伪数组的自动热键变量表达式 - 将字符串转换为数字?

  20. 20

    Linq表达式转换为字符串

  21. 21

    将NCalc表达式转换为字符串

  22. 22

    将字符串转换为 SymPy 表达式?

  23. 23

    Perl正则表达式:如何在不带\“的情况下将字符串从”转换为“?

  24. 24

    在dhtmlxScheduler和AngularJS中将日期转换为字符串

  25. 25

    如何在Google表格中将“ +”字符转换为REGEXMATCH的正则表达式?

  26. 26

    如何在PHP中将字符串转换为日期或日期时间

  27. 27

    如何在pyspark中将日期时间从字符串格式转换为日期时间格式?

  28. 28

    如何在PHP中将字符串转换为日期或日期时间

  29. 29

    如何在MySQL中将日期从日期转换为字符串?

热门标签

归档