ng-show on ionic button

Question

I want to hide thebutton at the begin until I have presses another buttons to make them appear... My codes are as followed:

The button Controller + javascript:

<div ng-controller="PrintTicket">
              <button class="button button-dark" id="btn-printTicket" ng-click="isPrinted()">Print Ticket</button><br></div>


myIonic.controller('PrintTicket',function($scope){
var init_state = false;
 $scope.isPrinted = init_state;
$scope.PrintTicket = function(){
$scope.isPrinted = !init_state;
return $scope.isPrinted;
} });

The button to display after click:

<div ng-controller="PrintTicket" ng-show="isPrinted">
                <button class="button button-dark" id="ticket1_dark"><b>1234</b></button></div>

May you please kindly give me some advices please. Thank you for your time.

Link to Plunker

Answer 1

For printing ticket you should call PrintTicket function instead of isPrinted which will then set isSelected flag.

ng-click="PrintTicket()"

You shouldn't be defining ng-controller="PrintTicket" twice which will instantiate controller function again. You should have both divs wrap inside single controller called PrintTicket

Plunkr Demo

---

After a discussion it seems like you wanted to share a data amongest two controller, so for that reason you could service to sharing data between two controller. So you can set service variable in one controller and access that value from service inside another controller.

Answer 2

 <div ng-controller="PrintTicket">
          <button class="button button-dark" id="btn-printTicket"
  ng-click="isPrinted()">Print Ticket</button><br></div>


 <div ng-controller="PrintTicket" ng-show="showPrintButton">
   <button class="button button-dark" id="ticket1_dark"><b>1234</b></button></div>





myIonic.controller('PrintTicket',function(`enter code here`$scope){
var init_state = false;

$scope.showPrintButton = false;
$scope.isPrinted=function(){    //$scope.isPrinted is a function
$scope.showPrintButton = true;
}
});