Переключение между двумя функциями при нажатии кнопки.

У меня есть следующая кнопка, которую я использую в качестве переключателя.

<button ng-click="togglefunction()">Toggle Data</button>

Вот та часть переключателя, которая должна работать

 $scope.toggleToolPanel = function () {
        // need to put below 2 functions here so that when user clicks 1st time, function 1 executes. when user clicks again, function 2 executes and so on. 
    };

Это две функции, которые должны выполняться поочередно внутри функции toggleFunction

 function function1(params) { 
                return '<span  >' + data + '</span>';
    }

function function2(params) { 
                return '<span  >' + data *100 + '</span>';
    }

3 ответа

Решение

Добавьте это к вашему контроллеру:

$scope.firstFunction = false;

Затем поменяй toggleToolPanel к следующему:

$scope.toggleToolPanel = function() {
    $scope.firstFunction = !$scope.firstFunction;
    if($scope.firstFunction) {
        function1(params);
    } else {
        function2(params);
    }
};

Переключайте класс на элементе кнопки при каждом нажатии. Увидеть classList.toggle, В вашем обработчике события click используйте classList.contains, чтобы найти наличие переключателя. Если есть х, если нет, у.

Код уборщика прилагается ниже:

angular.module('mainModule', [])
         .controller('MainCtrl', ['$scope', function($scope) {
           $scope.toggle = function() {
        $scope.isToggled = !$scope.isToggled;
        var params = $scope.isToggled;

                $scope.isToggled ? toggleIn(params) : toggleOut(params);

           };

           function toggleIn(params) {
        console.log(params);
       }

           function toggleOut(params) {
        console.log(params);
           }


         }]);

<body ng-app="mainModule">
<div ng-controller="MainCtrl">
  <input type="button" value="Toggle" ng-click="toggle()" />
</div>

</body>
Другие вопросы по тегам