解决方案1

Question

我是角度js的新手，我需要清楚一些关于角度js的事情。这是我的示例代码

<body ng-app="radioExample">
   <script>
   angular.module('radioExample', [])
     .controller('ExampleController', ['$scope', function($scope) {
       $scope.color = 'blue';
       $scope.disabled = false;

       if($scope.color == 'red'){
         $scope.disabled = true;
       }

     }]);
 </script>
 <form name="myForm" ng-controller="ExampleController">
   <input type="radio" ng-model="color" value="red" >  Red <br/>
   <input type="radio" ng-model="color" value="green"> Green <br/>
   <input type="radio" ng-model="color" value="blue"> Blue <br/>
   <tt>color = {{color | json}}</tt><br/>
   <tt>{{disabled}}</tt><br/>
  </form>

</body>

当我选择“红色”按钮时，它是不是像我在$scope.disabled声明中提到的那样将true的值更新为if？当我需要这样做时，我该如何实现呢？

谢谢。

Answer 1

解决方案1

简单的解决方案是将“禁用”定义为函数，以便角度在每个摘要周期中重新计算。

$scope.disabled = function() { return $scope.color === 'red'; }

稍后使用

<tt>{{disabled()}}</tt>

解决方案2

如果您不希望disabled成为某项功能。在color上添加一个监视并更新已禁用的值。

$scope.$watch('color', function(){
  $scope.disabled = ($scope.color === 'red');
})

Answer 2

没有它赢了，你可以尝试使用ng-change listener并分配范围

 <body ng-app="radioExample">
   <script>
      angular.module('radioExample', [])
        .controller('ExampleController', ['$scope', function($scope) {
          $scope.color = 'blue';
          $scope.disabled = false;

          $scope.foo = function(){
            if ($scope.color === 'red'){
            $scope.disabled = true;
          }
      }
        }]);
   </script>
   <form name="myForm" ng-controller="ExampleController">
      <input type="radio" ng-model="color" value="red" ng-change="foo()" >  Red <br/>
      <input type="radio" ng-model="color" value="green" ng-change="foo()"> Green <br/>
      <input type="radio" ng-model="color" value="blue" ng-change="foo()"> Blue <br/>
      <tt>color = {{color | json}}</tt><br/>
      <tt>{{disabled}}</tt><br/>
   </form>
</body>

单选按钮中的角度数据绑定

2 个答案:

解决方案1

解决方案2

单选按钮中的角度数据绑定

2 个答案:

解决方案1 ​​

解决方案2

解决方案1