码:
<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页面本身表达式中的数字或日期.任何线索!!
解决方法
这是通过使用$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.$格式化
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.$解析器
Array of functions to execute,whenever the control reads value from the DOM. Each function is called,passing the value through to the next. The last return value is used to populate the model. Used to sanitize / convert the value as well as validation. For validation,the parsers should update the validity state using $setValidity(),and return undefined for invalid values.
来源文件:https://docs.angularjs.org/api/ng/type/ngModel.NgModelController