【问题标题】:Anugularjs ng-disabled not working as expected for a button elementAnugularjs ng-disabled 对于按钮元素没有按预期工作
【发布时间】:2017-12-10 04:05:06
【问题描述】:

我创建了一个新按钮,该按钮应在页面加载时启用,并在页面上的数据保存时禁用(有一个保存按钮)。所以基本上,只要启用保存按钮,就应该禁用这个新按钮。

角度代码:

<input id="save" class="btn " type="button"
                        value="SAVE BUTTON" ng-click="saveData()" ng-disabled="isSaveButtonDisabled"  /> 
<input id="create" class="btn " type="button"                   
                    value="NEW BUTTON" ng-click="createNewButton()" ng-disabled="isCreateButtonDisabled" /> 

在控制器中,它被附加到范围:

$scope.isSaveButtonDisabled= isSaveButtonDisabled;
$scope.isCreateButtonDisabled= isCreateButtonDisabled;

并且有两个函数定义了这个属性的值:

function isSaveButtonDisabled(){
        $scope.isSaveButtonDisabled= true;  
}
function isCreateButtonDisabled(){
        $scope.isCreateButtonDisabled= false;   
}

但无论如何,创建按钮仍然处于禁用状态。

我错过了什么?

【问题讨论】:

  • 布尔值和函数名相同。那根本行不通。另外,您并没有真正切换状态,只需将其设置为一个值。
  • 布尔值是:isSaveButtonDisabled,调用的函数是 saveData()。他们有不同的名字。
  • 当你这样做时: $scope.isSaveButtonDisabled= isSaveButtonDisabled;您正在将一个分配给另一个。

标签: javascript angularjs button save click


【解决方案1】:

您可以在ng-click 中调用两个函数

试试这个方法。

$scope.isSaveButtonDisabled= function(){
        $scope.isSaveButtonDisabled= true;
       $scope.isCreateButtonDisabled= false;     
}

$scope.isCreateButtonDisabled= function(){
        $scope.isCreateButtonDisabled= false; 
        $scope.isSaveButtonDisabled= true;  
}

请在 HTML 中更改您的代码,例如

<input id="save" class="btn " type="button"
                        value="SAVE BUTTON" ng-click="isSaveButtonDisabled();saveData();" ng-disabled="isSaveButtonDisabled"  /> 
<input id="create" class="btn " type="button"                   
                    value="NEW BUTTON" ng-click="isCreateButtonDisabled();createNewButton();" ng-disabled="isCreateButtonDisabled" /> 

【讨论】:

  • ng-click() 应该调用不同的函数 saveData() 和 createNewButton() 如代码所示。
  • @user3772144 。我已经按照您的期望更改了答案:)
  • 我不想在点击按钮时激活 ng-disabled,我希望在页面加载时激活它。
  • 感谢您的帮助
【解决方案2】:

对于这两个按钮,您是否定义了与“真/假”布尔属性同名的函数?如果是这样,那么您需要将两个包装函数更改为不同的东西(可能是 disableSaveButton()、disableCreateButton())并在现有的 saveData()/createNewButton() 中调用这两个函数

【讨论】:

  • 感谢您的帮助。
猜你喜欢
  • 1970-01-01
  • 2014-10-14
  • 2017-08-20
  • 2018-04-24
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2015-08-02
相关资源
最近更新 更多