Angular JS - 启用和禁用按钮

时间:2016-08-23 12:33:22

标签: angularjs

我有一个条件,它只是在可选图像中选择一个图像,下一个按钮需要启用,并且下一个外部选择也不应该启用下一个按钮。这里的问题是选择第一个图像按钮是否启用,范围是将值赋值为false,并且对于第二次迭代的图像,它不会成立。请让我知道这个问题。

                            <div class="col-xs-6 col-md-10 col-lg-7">
                            <div ng-repeat="outer in outers track by $index" >
                                <div ng-if="outer_index== $index">                          
                                    <div ng-bind="::outer.label"></div>                               
                                    <ul class="list-group">                               
                                        <li class="cursorPointer" ng-repeat="inner in outer.inners | orderBy: 'id'" ng-class="{'selected': getSelectedClass($parent.$index, $index)}" class="deselected">
                                        <div class="col-xs-6">
                                        <div class="img">   
                                        <img ng-src="data:image/png;base64,{{inner.base64Icon}}"  alt="{{inner.description}}" title="{{inner.description}}"   
                                            ng-click="process()">
                                        <div class="desc" ng-bind="inner.description"></div></div>
                                        </div>
                                        </li>                                 
                                    </ul>   
                                </div>                                                  
                            </div>
                        </div>      
                     <div><button type="button" class="btn btn-info" ng-disabled="outer_index == outers.length -1 || disableNext" ng-click="getNext()">Next</button></div>

在JS代码中,仅在

时激活按钮
$scope.disableNext=true;
    $scope.process = function() {
    $scope.disableNext=false;
 }

 $scope.getNext = function (){
     $scope.outer_index = $scope.outer_index + 1;
    $scope.datas = $scope.outers[$scope.outer_index];
 }

注意:我试过了 对于此情况,ng-click="process();disableNext=false;"将无效ng-repeat

1 个答案:

答案 0 :(得分:0)

在选择next后将disableNext设置为true,它可以正常运行!!!

  $scope.getNext = function (){
          $scope.disableNext=true;
          $scope.outer_index = $scope.outer_index + 1;
          $scope.datas = $scope.outers[$scope.outer_index];
     }