在ng-click上隐藏当前按钮

Hide a Current Button on ng-click

本文关键字：按钮 隐藏 ng-click      更新时间：2023-09-26

我有一个按钮用于更新ng-form中的数据。此按钮仅在更改某些表单输入时出现。我用$dirty做了这个。

当单击Update时，我更新数据。但是我想在点击时隐藏这个按钮。

我有一个ng-click方法按钮点击。

我试着像这样隐藏它:-

$(this).hide();

以上解决方案不起作用&我也想要一些不基于jquery的解决方案。

HTML

<button class="btn-small" ng-click="updateData('contactinformation')" ng-show="contactinformationform.$dirty">Update</button>

代码
$scope.updateData = function (category) {
        switch (category) {
            case 'basicinformation':
                $scope.categorynewdata = $scope.data.basicinformation[0];
                break;
            case 'contactinformation':
                $scope.categorynewdata = $scope.data.contactinformation[0]
                break;                
        }
        var query = {               
            category: category
        };
        Patients.updateData().save(query).$promise.then(function (data) {
            alert('Data updated successfully..!');
        });
    }

你可以像这样在按钮中使用ng-hide

定义作用域变量(如标志)，以便您可以决定何时隐藏/显示按钮。

<button ng-click="btnClicked()" ng-hide="hideMe">Submit</button>
控制器

// Initialize hideMe variable
$scope.hideMe = false;
$scope.btnClicked = function() {
     /* your code */
     $scope.hideMe = true;
}

你可以这样尝试

演示工作

<div ng-app='myApp' ng-controller="ArrayController">
    <form>
        <input type="text" ng-model="name" ng-change='flag=false' />: Name
        <br>
        <input type="text" ng-model="age" ng-change='flag=false' />: Age
        <br>
        <button class="btn-small" ng-click="updateData('contactinformation')" ng-hide='flag'>Update</button>
    </form>
</div>
脚本

var app = angular.module('myApp', []);
app.controller('ArrayController', function ($scope) {
    $scope.name = 'Manu';
    $scope.age = '21';
    $scope.flag = true;
    $scope.updateData = function (value) {
        $scope.flag = true;
    }
});
相关文章：