How to add custom form validation inside angular controller?

Question

I'm trying to implement custom form validation with angular for an email input . I would like the input to be valid only with the appropriate domain (here that is @example.com).

The code below works, EXCEPT that it runs before the HTML form is initialized, triggering the error: "TypeError: Cannot read property '$error' of undefined"

app.controller('TeamSignInController', function($scope) {

    $scope.domain = "@example.com";

    var EMAIL_REGEXP = new RegExp("^[a-z0-9!#$%&'*+/=?^_`{|}~.-]+" + $scope.domain + "$", "i");
    $scope.form.$error.required[0].$validators.email = function (modelValue) {
        return EMAIL_REGEXP.test(modelValue);
    }

}

What is the best way to set up custom form validation in an angular controller so that it only initializes once the form element is fully loaded? I've tried using ng-init on the form, but that fires before each form element has fully loaded.

And here's the HTML:

<section id="teamSignIn">
  <form name="form" ng-submit="loginUser(credentials)">
    <div class="form-group">
      <input type="email" class="form-control text-left input-lg" placeholder="you@example.com" ng-model="credentials.email" required>
    </div>
    <div class="form-group">
      <input type="password" class="form-control text-left input-lg" placeholder="password" ng-model="credentials.password" required>
    </div>
    <button class="btn btn-default btn-lg btn-blue" type="submit">
      Sign in
    </button>
  </form>
</section>