JavaScript AngularJS 在 HTML 中调用函数

Question

我有一个复选框。

如果选中 -> 调用一个函数displayBus(number)

如果未选中 -> 调用其他函数displayCar()

此代码的问题是我还必须单击“隐藏”或“显示”才能调用该函数。

  <input type="checkbox" id="mycheckbox" name="mycheckbox" ng-model="mycheckbox" />
        <div ng-show="mycheckbox">
             <a style="cursor: pointer;" ng-click="displayBus(number);">hide</a>

        </div>
        <div  ng-hide="mycheckbox">
            <a style="cursor: pointer;" ng-click="displayCar();">show</a>
        </div>

但我只想选中/取消选中，然后自动调用该函数。 我不想点击隐藏或显示。

感谢您的帮助。

Answer 1

您可以将 ng-change 连接到复选框，然后检查它的值:

<input type="checkbox" id="mycheckbox" name="mycheckbox" ng-model="mycheckbox" data-ng-change="dataChanged()" />

然后在你的 JavaScript 中:

$scope.dataChanged = function(){
    if($scope.mycheckbox){
        //checked
    }
    else{
        //not checked
    }
};

<小时/>

编辑:

如果您只想在 html 中执行此操作:

<a style="cursor: pointer;" ng-click="myCheckbox ? displayBus(number) : displayCar()">hide</a> 

<小时/>

编辑:

<input type="checkbox" id="mycheckbox" name="mycheckbox" ng-model="mycheckbox" data-ng-change="myCheckbox ? displayBus(number) : displayCar()" />