ahmdabos ahmdabos - 4 months ago 22
AngularJS Question

How to check If ng-show is true then do something in angularjs

<div class ="container" ng-show="mbrscemployee=='yes'">
<span class="btn">click<span>
</div>
<button class="submit">submit</button>


When someone press
button
tag, it will check if
ng-show
is
true
, then the
span
will be clicked automatically.

Answer

If you want the click event to be triggered on the span element, after you click the button, when ng-show is true:

DOM:

<div class="container" ng-show="mbrscemployee=='yes'">
    <span id="myspan" class="btn">click<span>
</div>
<button ng-click="btnClick()" class="submit">submit</button>

Controller:

$scope.btnClick = function() {
    if ($scope.mbrscemployee == 'yes') {
        angular.element('#myspan').triggerHandler('click');
    }
}

Edit: Although, the following approach makes more sense:

DOM

<div class="container" ng-show="mbrscemployee=='yes'">
    <span ng-click="spanClick()" id="myspan" class="btn">click<span>
</div>
<button ng-click="btnClick()" class="submit">submit</button>

Controller:

$scope.spanClick = function() {
    // do something
}

$scope.btnClick = function() {
    if ($scope.mbrscemployee == 'yes') {
        $scope.spanClick();
    }
}