I'm trying to get form validations to work with an Angular Wizard

Question

I am using an angular wizard for my app\'s registration process.

Angular Wizard - https://github.com/mgonto/angular-wizard

However, no matter what I try, each s

Answer 1

I think part of your problem is the lack of dotted notation on your ng-models. In general you want ng-model="container.piece". There are numerous articles on the problem of writing to a child scope if your models do not contain a dot in them. Have a look at Understanding scopes.

Answer 2

It's definitely a scoping problem. I was able to get things to work by reaching into the scope of a child element (in the controller) and by defining the variables in the view (html) as being part of the $parent element. This means that all of the variables are set in HTML as

ng-model="$parent.variableName";

Changing this variable's value from the controller requires a call as follows:

$scope.$$childTail.variableName = 'something that you want to change the value to';

But reaching into $$childTail is a no-no. This whole project needs to be reworked to fix the scoping problem if you ask me. And there needs to be documentation on how to access validation variables if the revised project uses anything outside of typical angular data binding.

My solution code is attached in gists, below.

Controller Setup https://gist.github.com/Shawful/a4f8ff5097eabc5306f4

HTML Setup https://gist.github.com/Shawful/f8dc97d6fd88bbb111f9