0

我正在努力弄清楚如何根据布尔变量的值禁用 ng-click 事件。

我有一个表单,用户必须单击(+)符号/链接才能添加新记录,当用户这样做时,会触发一个小函数,并将布尔值设置为 false。

代码:

vm.addNewRecord = function (formClass) {
    vm.hasID = false;
};

该表单有一个图标/链接,允许用户将有关参与者的信息保存到记录中。

代码:

<div class="icon">
    <a ng-click="addParticipants(data)">
        <i class="fa fa-fw fa-plus"></i>
    </a>
</div>                        

那个问题是这个信息依赖于一个记录id,但是这个id还不存在。

我需要能够禁用 ng-click 的:addParticipants(data)是 hasId = false 的值,同时(以某种方式)允许用户单击它以在以下行中显示一条消息:“请在添加参与者之前保存此记录。”

到目前为止我已经尝试过,但没有成功:

<div class="datagrid-icon">
    <a ng-click="datagrid.add(datagrid)" ng-disabled="!hasID">
        <i class="fa fa-fw fa-plus"></i>
    </a>
</div>

和:

<div class="datagrid-icon">
    <a ng-click="datagrid.add(datagrid)"  ng-class="{'disabled': !hasID}">>
        <i class="fa fa-fw fa-plus"></i>
    </a>
</div>

我检查了 hasID 的值,它是假的,但我仍然可以单击 addParticipants 的 (+) 符号。而且,我不确定如果我设法禁用点击,我将显示指示用户首先保存主记录然后添加参与者的消息。

如果有人可以提供一些帮助来解决这个问题,那将不胜感激。

谢谢你。

4

1 回答 1

1

要禁用链接,您可以这样做

<a ng-click="hasID && datagrid.add(datagrid)">
    <i class="fa fa-fw fa-plus"></i>
</a>

但是最好在控制器中有一个方法,比如

vm.addToGrid = function(id) {
    if (id) {
    $scope.datagrid.add(id);
  } else {
    alert('Save the record before');
  }
}

<a ng-click="vm.addToGrid(datagrid)">
    <i class="fa fa-fw fa-plus"></i>
</a>
于 2016-03-16T17:20:26.257 回答