Hey the way you are going the main problem will be that when the user will be filling any random data in the last text box, the moment he fills a letter the div will be visible to him - despite whatever improvements you make to the code.
What I'll suggest is - make use of ng-show="whatever"
for that section that you want to show after the data has been filled.
In the beginning where your controller starts make it false $scope.whatever = false;
and now it wont be visible to the user; when the user has filled all the text boxes call a trigger and check if the data is valid or not and then $scope.whatever=true;
- Now your section will be visible.
To call the trigger you can do various things
- you can make use of ng-change
on the last textbox and there check values of all textboxes using their specific model name, I hope you know that.
Let me know if you want further clarification on this.