多状态按钮就像angularJS切换 [英] Multi State button like toggle in angularJS

问题描述

我想实现表一个功能，用户可以通过点击它设置单元格的值。
可以有3-4个说的状态，也有NG的模式连接到它。

I want to implement a feature in table where user can set value of cell by clicking on it. there can be say 3-4 states,also a ng-model attached to it.

的我所期望的是angularjs切换按钮，但他们开/关型单纯。的

在短;点击该按钮将设定值：活动，不活动，已排除
寻找与多个国家的解决方案。
任何帮助，这确实是AP preciated。

In short; Clicking on the button will set the value as: Active, Inactive, Excluded Looking for solution with multiple state. Any help with this is really appreciated.

推荐答案

检查以下的例子：

http://jsfiddle.net/vishalvasani/ZavXw/9/

和控制器code

function MyCtrl($scope) {

    $scope.btnarr=0;
    $scope.btnTxt=["Active","Inactive","Excluded"]
    $scope.change=function(){
        switch($scope.btnarr)
        {
            case 0:
                $scope.btnarr=1;
               break;
            case 1:
                 $scope.btnarr=2
               break;
            case 2:
                 $scope.btnarr=0;
               break;                
        }
    }
}

或

控制器较短的版本

function MyCtrl($scope) {

    $scope.btnarr=0;
    $scope.btnTxt=["Active","Inactive","Excluded"]
    $scope.change=function(){
      $scope.btnarr = ($scope.btnarr + 1) % $scope.btnTxt.length;
    }
}

和HTML

<div ng-controller="MyCtrl">
    <button ng-modle="btnarr" ng-Click="change()">{{btnTxt[btnarr]}}</button>
</div>

这篇关于多状态按钮就像angularJS切换的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！