0

I am trying to create a set of buttons in Angular, and my desired behavior is that when the user clicks the first button, the second button appears. They would then fill out some stuff and continue. Then when the second button is clicked, the third button appears, they do more stuff, etc. For now I am just trying to get the buttons to work properly with respect to the ng-show/ng-hide functionality, but it doesn't seem to be working. I have tried to find a number of methods to do this using Google searches and searches on this site, but nothing seems to work. No matter what, all the buttons are visible. The code is below. Does anyone see what I am doing wrong?

Edit: I forgot to mention that I tried totally clearing all the code in the corresponding .css file to see if the CSS was somehow overriding the desired behavior, with the same result.

<button mat-raised-button ng-click="pullLis=true" ng-init="pullLis=false" color="primary">Check In</button>
<button mat-raised-button ng-click="pullPat=true" ng-hide="!pullLis" color="primary">Pull LIS Orders</button>
<button mat-raised-button ng-click="addPapPat=true" ng-hide="!pullPat" color="accent">Pull Patient Orders</button>
<button mat-raised-button ng-hide="!addPapPat" color="warn">Add Paper Patient</button>
<button mat-raised-button disabled>Check Out</button>
NellaGnute
  • 225
  • 1
  • 6
  • 15
  • can you include your code on plunker/stackblitz with a working demo? – Nitishkumar Singh Sep 06 '18 at 17:00
  • @NitishkumarSingh - I haven't used plunker before, but I think this should work: [Test](https://next.plnkr.co/edit/NB3xASyWLPmTgGPr) – NellaGnute Sep 08 '18 at 15:42
  • @NitishkumarSingh - I think I realized what is going on here. AngularJS and Angular2+ are not the same thing. I think I am probably using AngularJS syntax when I am using Angular2+. I am fairly new to this, so it's probably a newbie mistake on my part. Is that likely the issue? – NellaGnute Sep 08 '18 at 17:01
  • The syntax looks AngularJS one for sure. It's not Angular syntax – Nitishkumar Singh Sep 08 '18 at 17:05
  • @NitishkumarSingh - yep, that was it - here's what I had to change it to: ` ` with this as the CSS: `.hide { display: none !important; }` – NellaGnute Sep 08 '18 at 17:16

0 Answers0