angularJS : 根据变量值禁用link,并显示消息框
angularJS : disable link based on variable value, and display message box
我正在努力弄清楚如何根据布尔变量的值禁用 ng-click 事件。
我有一个表单,用户必须在该表单上单击 (+) 号/ link 才能添加新记录,当用户这样做时,会触发一个小功能,并设置一个布尔值假的。
代码:
vm.addNewRecord = function (formClass) {
vm.hasID = false;
};
表单有一个图标/link,允许用户将有关参与者的信息保存到记录中。
代码:
<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 的值,同时(以某种方式)允许用户单击它以显示以下行的消息:"Please save this record before adding participants."
到目前为止我尝试过但没有成功的方法:
<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 的值,它是 false,但我仍然可以单击 (+) 号来添加参与者。而且,我不确定如果我设法禁用点击,我将显示指示用户首先保存主记录然后添加参与者的消息。
如果有人能提供一些帮助来解决这个问题,我们将不胜感激。
谢谢。
要禁用 link 你可以像
<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>
我正在努力弄清楚如何根据布尔变量的值禁用 ng-click 事件。
我有一个表单,用户必须在该表单上单击 (+) 号/ link 才能添加新记录,当用户这样做时,会触发一个小功能,并设置一个布尔值假的。
代码:
vm.addNewRecord = function (formClass) {
vm.hasID = false;
};
表单有一个图标/link,允许用户将有关参与者的信息保存到记录中。
代码:
<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 的值,同时(以某种方式)允许用户单击它以显示以下行的消息:"Please save this record before adding participants."
到目前为止我尝试过但没有成功的方法:
<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 的值,它是 false,但我仍然可以单击 (+) 号来添加参与者。而且,我不确定如果我设法禁用点击,我将显示指示用户首先保存主记录然后添加参与者的消息。
如果有人能提供一些帮助来解决这个问题,我们将不胜感激。
谢谢。
要禁用 link 你可以像
<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>