使用AngularJS进行ng单击后隐藏按钮

Question

我是angularjs的新手，想知道如何在单击（使用ng-click）后隐藏按钮。

<button ng-click="xyz()" class="btn-default pull-right">
    Start
</button>

Answer 1

基本上，您需要做两件事：

• 利用按钮可见性的变量
• 用于更新此变量的函数（您可以在HTML中完成此操作，但我不鼓励这样做）。

所以您将有一个按钮：

<button ng-click="hideButton()" ng-show="isButtonVisible === true" class="btn-default pull-right">
    Start
</button>

然后，您将拥有以下变量

$scope.isButtonVisible = true; // true to make the button visible by default

最后，切换它的功能：

$scope.hideButton = function() {
    $scope.isButtonVisible = false;
}

请注意，如果您不再需要按钮，可以使用ng-if从DOM中删除按钮。

示例：https://plnkr.co/edit/fnW8HR58zKHs4T34XRan

请注意，这几乎是您在AngularJS上可能遇到的最基本的问题，因此，我建议您在询问Stack Overflow之前先阅读一些有关此问题的信息。

Answer 2

您将需要一个变量来表示按钮的可见性，其值将随着click事件而变化。

<button ng-click="clickEventFunction(params)" ng-hide="isButtonVissible">Button</button>

此变量的默认值应为“ false”以显示按钮

$scope.isButtonVissible = false

然后在clickEventFunction中，更改值以隐藏按钮

$scope.clickEventFunction = function(params){
$scope.isButtonVissible = true; 
//* Do the logic code
}

Answer 3

视图中：

 <button ng-click="hideBtn = true" ng-hide="hideBtn">Button</button>

在控制器中：

 $scope.hideBtn = false;

Answer 4

我在一些帮助下找到了问题的答案。在点击功能中创建了一个事件，并且能够隐藏该按钮。

<button ng-click="xyz($event)" class="btn-default pull-right">Start</button>

$scope.xyz = function ($event) {
    $($event.target).hide();

为您的所有指导加油。