如何减少angularjs中的条件?

时间:2016-03-30 06:58:40

标签: php html angularjs

我有8个像这样的图标

enter image description here

每个图标都有不同的功能。多个图标也可以单击,调用不同的功能。

这只是一个例子但我必须做其他事情。我需要知道如何为这个功能提供合适的条件

现在我正在采取以下方式

html代码前2个图标

<input value="1" type="checkbox" name="function[]" id="checkbox_vs1" ng-model="selection[1]"  ng-change="onFChange()"/>

并在控制器中

$scope.onFChange = function()
{
     if(this.selection[1] == true && this.selection[2] == false && this.selection[3] == false && this.selection[4] == false && this.selection[5] == false && this.selection[6] == false && this.selection[7] == false && this.selection[6] == false)
             {
                 //call function
             }
}

像这样我必须检查所有组合是否有任何简单的方法我可以实现这个

这是掠夺者 https://plnkr.co/edit/HNqc2GaQFgoMwhO5S9Ot链接

如果有条件,这将有40320。我需要减少这个

谢谢

3 个答案:

答案 0 :(得分:0)

这是你的意思吗?

$scope.onFChange = function()
{
     if(this.selection[1] && !this.selection[2] && !this.selection[3] && !this.selection[4] && !this.selection[5] && !this.selection[6] && !this.selection[7] && !this.selection[6])
     {
         //call function
     }
}

这是使用truthy的。

修改

$scope.onFChange = function()
{
     var s1 = selection[1];
     var s2 = selection[2];
     var s3 = selection[3];
     var s4 = selection[4];
     var s5 = selection[5];
     var s6 = selection[6];
     var s7 = selection[7];
     var s8 = selection[8];

     // Condition 1
     if(s1 && !s2 && !s3 && !s4 && !s5 && !s6 && !s7 && !s8)
     {
         //call function
     }
}

这样可以更容易地写出你的条件。

答案 1 :(得分:0)

您可以为此制作通用函数,例如此

     if(this.selection[1] && !this.selection[2] && !this.selection[3] &&  !this.selection[4] && !this.selection[5] && !this.selection[6] &&   !this.selection[7] && !this.selection[6])
     {
     //call function
     }
     //Code for above function 


     function checkCondition(index,this.selection)
     {
        if(!this.selection[index])
         {
            return false;
         }
      for(var i=1;i<this.selection.length;i++)
       {
         if(this.selection[i]&&i!=index)
          {
                return false;

           }

       }
            return true;

     }

请注意,这是一个帮助您制定方法的粗略想法

答案 2 :(得分:0)

创建一个循环选择的函数,以检查是否有任何其他值为真。例如:

HTML:

<input value="1" type="checkbox" name="function[]" id="checkbox_vs1" ng-model="selection[1]"  ng-change="onFChange(1)"/>

控制器:

$scope.onFChange = function(checkedBoxNumber)
{
     if(checkSelection(checkedBoxNumber))
     {
         // Do stuff
     }
}

function checkSelection(checkedBoxNumber) {
    for (var i = 0; i < selection.length; i++) {
        // Check values
        // Return false if other values are true
    }
    return true;
}