Angularjs   发布时间:2022-04-20  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了如何在angularjs表达式中将字符串转换为数字或日期大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
我正在使用 angularjs制作一个分页类型的东西,比如我有一个2D数组,我正在显示它的值.它的工作正常,但我也希望能够编辑thoes值,所以我在输入标签使用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页面本身表达式中的数字或日期.任何线索!!

解决方法

这种方式使用指令自动将数字转换为字符串,反之亦然.我的意思是使用输入元素type = number绑定到字符串变量.

这是通过使用$formatters和$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">

更多信息:

ngModel.$格式化

ngModel.$解析器

PLUNKER

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

大佬总结

以上是大佬教程为你收集整理的如何在angularjs表达式中将字符串转换为数字或日期全部内容,希望文章能够帮你解决如何在angularjs表达式中将字符串转换为数字或日期所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。