javascript – ng-model单选按钮中的类型更改

前端之家收集整理的这篇文章主要介绍了javascript – ng-model单选按钮中的类型更改前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
请注意这个例子:

JSFiddle Sample

  1. <div ng-controller="myCtrl">
  2. var ng-model = {{myValue}} - {{myType}}
  3.  
  4. <input type="radio" value="true"
  5. name="boolean" ng-change="logIt()" ng-model="myValue" /> True
  6. <input type="radio" value="false"
  7. name="boolean" ng-change="logIt()" ng-model="myValue" /> False
  8.  
  9. </div>
  10. var myApp = angular.module('myApp',[]);
  11.  
  12. function myCtrl($scope)
  13. {
  14. $scope.myValue = true; //does not work
  15. //$scope.myValue = 'true'; //it does work
  16. $scope.myType =(typeof $scope.myValue);
  17. $scope.logIt=function(){
  18. $scope.myType =(typeof $scope.myValue);
  19. }
  20. }

正如您所看到的,最初typeof的类型为boolean,但在选择值后,它将更改为string,而true不等于’true’.有什么方法可以让角度保留原始类型.

在这一点上,我正在考虑编写自己的指令来控制这种行为,但是看起来角度改变原始类型并不正确,我是否正确?

解决方法

使用ng-value和angular将处理转换回布尔值:

这是updated jsfiddle.

强制性代码

  1. <div ng-controller="myCtrl">
  2. <h1>Sample 1- Booleans</h1>
  3.  
  4. var ng-model = {{myValue}} - {{myType}}
  5. <br />
  6. <input type="radio" ng-value="true" name="boolean" ng-change="logIt()" ng-model="myValue" /> True
  7. <input type="radio" ng-value="false" name="boolean" ng-change="logIt()" ng-model="myValue" /> False
  8. </div>

猜你在找的JavaScript相关文章