单击 AngularJS 后切换按钮

Question

当我点击按钮 "on" 我的 API 运行 xhr 到 "activate" 我的数据。但是当我点击按钮 "off" 我的 API 运行 XHR 到 "deactive" 我的 data.isactive 我从数据 API（0 或 1）中得到。因此，我使用 _

ng-show and ng-hide

我确实显示了我的按钮 "off" 或 "on" 以显示我的 isactive === 1 或 isactive === 0。

我使用了这个代码 HTML :

<button ng-show="data.active" type="button" class="btn btn-default" ng-click="FiturThread(data)"><i class="fa fa-toggle-off"></i> Off</button>
<button ng-hide="data.active" type="button" class="btn btn-success" ng-click="FiturThread(data)"><i class="fa fa-toggle-on"></i> On</button>

我的问题是我点击了按钮 "on" 和警报运行 "Success Active" ，按钮 "on" 应该替换为按钮 "off"，所以改为。

你能给我解决方案吗？我必须使用什么？谢谢

Answer 1

这是工作示例

试试这个

<!DOCTYPE html>
<html lang="en">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js">   
</script>                 

<body>
    <div ng-app="myApp" ng-controller="myCtrl">
        <button ng-show="data.active" ng-click="FiturThread(data)">First Button</button>
        <button ng-hide="data.active" ng-click="FiturThread(data)">Second Button</button>
    </div>

    <script>

        var app = angular.module('myApp', []);
        app.controller('myCtrl', function($scope) {

           $scope.data = {};
           $scope.data.active = true;
           $scope.FiturThread = function(){
             $scope.data.active = !$scope.data.active;
         }

     });
 </script>
</body>
</html>

单击 AngularJS 后切换按钮

Switch Button After Clicked With AngularJS

javascript

angularjs

angularjs-ng-click

angularjs-ng-show