Angular: Setting form scope (eg ng-if)

http://angularjs.org/

by badsyntax

HTML

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0/angular.min.js"></script>
<div ng-controller="MyCtrl">
    <div ng-if="showForm">
        <form name="form.theform" novalidate>
            <div><input type="text" required ng-model="$parent.name" />
            <p>Form is valid: {{form.theform.$valid}}</p>
            <div><button ng-click="submit()">Submit</button></div>
        </form>
    </div>
</div>

JavaScript

var myApp = angular.module('myApp',[]);

//myApp.directive('myDirective', function() {});
//myApp.factory('myService', function() {});

function MyCtrl($scope) {
    $scope.name = 'Superhero';
    $scope.showForm = true;
    $scope.name = '';
    $scope.form = {
        thename: {}
    };
    $scope.submit = function() {
        if (!$scope.form.theform) {
            alert('Form not in controller scope');
        }
        alert('Your name: ' + $scope.name);
        alert('Form is valid? ' + $scope.form.theform.$valid);  
    };
}