角-在点击时隐藏一个按钮,不使用ng-show或ng-hide

时间:2022-03-04 20:36:45

I would like to hide a button in my form, once it's submitted and everything is working fine, I need to hide it and show something else, is there a way to do in my controller:

我想在我的表单中隐藏一个按钮,一旦它提交并且一切正常,我需要隐藏它并显示一些其他的东西,在我的控制器中有什么方法可以做:

this.show= false; 

Or do I need to add ng-show to the button and implement a variable to set to hide it?

还是需要在按钮中添加ng-show并实现一个要设置为隐藏它的变量?

4 个解决方案

#1


1  

Instead of adding new variables, why not using what is already designed for that. In the angular object representing your form, there is a $submitted property. Therefore, providing your form is named myForm, something like that should do the trick:

与其添加新的变量,不如使用已经设计好的变量。在表示表单的角对象中,有一个$submit属性。因此,提供您的表单被命名为myForm,类似的操作应该可以实现:

<button ng-if="!myForm.$submitted">Button</button>

See official guide about forms in angular

见官方指南关于形式的角度

#2


2  

You could use ng-class:

您可以使用ng-class:

ng-class="{'some-class': !some.object.user, 'some-other-class': some.object.user}"

#3


0  

Other option would be to use ng-style to do the job:

另一种选择是使用ng样式来完成这项工作:

#4


0  

in controller

在控制器

$scope.condition = true;
$scode.activeCondition = function (con) {
    $scope.condition = !con;
};

in html

在html中

<button type="button" ng-class="{'active': condition}" ng-click="activeCondition(condition)">

#1


1  

Instead of adding new variables, why not using what is already designed for that. In the angular object representing your form, there is a $submitted property. Therefore, providing your form is named myForm, something like that should do the trick:

与其添加新的变量,不如使用已经设计好的变量。在表示表单的角对象中,有一个$submit属性。因此,提供您的表单被命名为myForm,类似的操作应该可以实现:

<button ng-if="!myForm.$submitted">Button</button>

See official guide about forms in angular

见官方指南关于形式的角度

#2


2  

You could use ng-class:

您可以使用ng-class:

ng-class="{'some-class': !some.object.user, 'some-other-class': some.object.user}"

#3


0  

Other option would be to use ng-style to do the job:

另一种选择是使用ng样式来完成这项工作:

#4


0  

in controller

在控制器

$scope.condition = true;
$scode.activeCondition = function (con) {
    $scope.condition = !con;
};

in html

在html中

<button type="button" ng-class="{'active': condition}" ng-click="activeCondition(condition)">