Question

我正在我的项目中实现以下单选按钮。我正在使用angularjs技术。

一旦我在浏览器上加载页面但是JSON对象中没有值。我已经在标签中将其作为属性赋予checked =“true”。

当我再次单击时间json对象带来值的单选按钮时。

<input type="radio" ng-model="formModel.internationalClient" ng-value="1">Yes

<input type="radio" ng-model="formModel.internationalClient" ng-value="0" ng-checked="true">No

点击单选按钮之前的json对象

{}

单击单选按钮后

{ “internationalClient”：0 }

所以，实际上，一旦我在浏览器上加载页面，我就想要这个值。

一旦我在浏览器上打开我的页面，我想要下面的结果。 { “internationalClient”：0 }

Answer 1

如果这是单个表单模型（不重复），只需在控制器中初始化：

$scope.formModel.internationalClient = $scope.formModel.internationalClient || 0;

它的缩写为：“将..internationalClient设置为自身，除非..internationalClient为null”。这样，如果它是一个国际客户端并返回该值，则此操作是幂等的。

如果是ng-repeat中的表格，等等：

<form ng-init="formModel.internationalClient = 0">

参考：https://docs.angularjs.org/api/ng/directive/ngInit

Answer 2

在您的Javascript文件中，您可以设置默认值

$scope.formModel.InternationalClient = 0;

然后让您的单选按钮更改值

Answer 3

这是你案件的plnkr。 https://plnkr.co/edit/TPbYAr0h3BIXQ1RzuMrv?p=preview

希望这有帮助。

<!doctype html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Example - example-radio-input-directive-production</title>


  <script src="//code.angularjs.org/snapshot/angular.min.js"></script>



</head>
<body ng-app="radioExample">
  <script>
  angular.module('radioExample', [])
    .controller('ExampleController', ['$scope', function($scope) {
      $scope.formModel = {
        internationalClient : 0
      }
    }]);
</script>
<form name="myForm" ng-controller="ExampleController">
  <label>
    <input type="radio" ng-model="formModel.internationalClient" ng-value="1">
    Yes
  </label><br/>
  <label>
    <input type="radio" ng-model="formModel.internationalClient" ng-value="0" ng-checked="true">
    No
  </label><br/>
  <tt>json = {{formModel}}</tt><br/>
 </form>
</body>
</html>

Angularjs单选按钮没有在json中给出默认值

3 个答案: