AngularJS - access ng-if'd form in controller

Question

So I have a form which is in a div with ng-if expression. Without that ng-if I could just do $scope.form, but as I found out ng-if creates a child scope.

How can I access the form in the controller then?

Basically:

<div ng-if="whatever">
    <form name="x">
    </form>
</div>

Answer 1

Always use model objects in scope rather than assign primitive properties directly to scope object

In controller

$scope.model = {
   whatever: true
};

Then in view:

<div ng-if="model.whatever">
    <form name="model.x">
    </form>
</div>

Now the child scope will inherit the object model and can therefore assign properties to it.

In the case of the form, ngForm will add the value in nameto model and will create all the validation properties internally which is why it wasn't necessary to orignally create that property in the scope

Or use controllerAs alias and controller syntax to avoid this