partial-register.html

<div ng-controller='homeController'>
    <div class="col-md-6 col-md-offset-3">
        <h2>Register</h2>
        <div ng-show="messages" class="alert alert-danger">{{messages}}</div>
        <form name="form" role="form">
            <div class="form-group" ng-class="{ 'has-error': form.firstName.$dirty && form.firstName.$error.required }">
                <label for="username">First name</label>
                <input type="text" name="firstName" id="firstName" class="form-control" ng-model="user.firstName" required />
                <span ng-show="form.firstName.$dirty && form.firstName.$error.required" class="help-block">First name is required</span>
            </div>
            <div class="form-group" ng-class="{ 'has-error': form.lastName.$dirty && form.lastName.$error.required }">
                <label for="username">Last name</label>
                <input type="text" name="lastName" id="Text1" class="form-control" ng-model="user.lastName" required />
                <span ng-show="form.lastName.$dirty && form.lastName.$error.required" class="help-block">Last name is required</span>
            </div>
            <div class="form-group" ng-class="{ 'has-error': form.addr.$dirty && form.addr.$error.required }">
                <label for="addr">Address</label>
                <input type="text" name="addr" id="addr" class="form-control" ng-model="user.addr" required />
                <span ng-show="form.addr.$dirty && form.addr.$error.required" class="help-block">Address is required</span>
            </div>
            <div class="form-group" ng-class="{ 'has-error': form.city.$dirty && form.city.$error.required }">
                <label for="city">City</label>
                <input type="text" name="city" id="city" class="form-control" ng-model="user.city" required />
                <span ng-show="form.city.$dirty && form.city.$error.required" class="help-block">City is required</span>
            </div>
            <div class="form-group" ng-class="{ 'has-error': form.state.$dirty && form.state.$error.required }">
                <label for="state">State</label>
                <input type="text" name="state" id="state" class="form-control" ng-model="user.state" required />
                <span ng-show="form.state.$dirty && form.state.$error.required" class="help-block">State is required</span>
            </div>
            <div class="form-group" ng-class="{ 'has-error': form.country.$dirty && form.country.$error.required }">
                <label for="country">Country</label>
                <input type="text" name="country" id="country" class="form-control" ng-model="user.country" required />
                <span ng-show="form.country.$dirty && form.country.$error.required" class="help-block">Country is required</span>
            </div>
            <div class="form-group" ng-class="{ 'has-error': form.postal.$dirty && form.postal.$error.required }">
                <label for="postal">Zip Code</label>
                <input type="text" name="postal" id="postal" class="form-control" ng-model="user.postal" required />
                <span ng-show="form.postal.$dirty && form.postal.$error.required" class="help-block">Postal is required</span>
            </div>
            <div class="form-group" ng-class="{ 'has-error': form.phone.$dirty && form.phone.$error.required }">
                <label for="phone">Phone Number</label>
                <input type="text" name="phone" id="phone" class="form-control" ng-model="user.phone" required />
                <span ng-show="form.phone.$dirty && form.phone.$error.required" class="help-block">Phone number is required</span>
            </div>
            <div class="form-group" ng-class="{ 'has-error': form.fax.$dirty && form.fax.$error.required }">
                <label for="fax">Fax Number</label>
                <input type="text" name="fax" id="fax" class="form-control" ng-model="user.fax" required />
                <span ng-show="form.fax.$dirty && form.fax.$error.required" class="help-block">Fax number is required</span>
            </div>
            <div class="form-group" ng-class="{ 'has-error': form.email.$dirty && form.email.$error.required }">
                <label for="email">Email</label>
                <input type="text" name="email" id="email" class="form-control" ng-model="user.email" required />
                <span ng-show="form.email.$dirty && form.email.$error.required" class="help-block">Email is required</span>
            </div>
            <div class="form-group">
                <label for="company">Company name (Optional)</label>
                <input type="text" name="company" id="company" class="form-control" ng-model="user.company" />
            </div>
            <div class="form-actions">
                <button type="submit" ng-disabled="form.$invalid || vm.dataLoading" data-ng-click="createUser(user)" class="btn btn-primary">Register</button>
            </div>
        </form>
    </div>
</div>