title: ng-file-upload file.$valid is undefined
body: <p>I'm trying to implement file uploading using the Angular [ng-file-upload[(<a href="https://github.com/danialfarid/ng-file-upload" rel="nofollow">https://github.com/danialfarid/ng-file-upload</a>) directive. I've followed the docs as closely as possible. I want the user to be able to fill in a form, attach an image, and hit the submit button. When that occurs, I then want to send the file and form input fields as json to the server.</p>
  
  <p>When I run my check to see if <code>image.$valid</code> is true, I get an error ``. I'm not sure what I'm missing here.</p>
  
  <p>Here is my controller:</p>
  
  <pre><code>var app = angular.module('myApp', ['ngAnimate','ui.bootstrap', 'ngFileUpload']);
  
  app.controller('NewPostQuestionCtrl', ['$scope', '$http', 'Upload', function($scope, $http, Upload) {
      $scope.image = {};
      $scope.form = {};
      $scope.postQuestion = {
          token: $scope.token,
          employer_id: $scope.employer_id,
          question: $scope.question,
          published: $scope.published
      };
  
      $scope.submit = function(postQuestionAttributes, image) {
          console.log(postQuestionAttributes.$valid)
          console.log(image.$valid)
          if (image &amp;&amp; image.$valid &amp;&amp; !image.$error &amp;&amp; postQuestionAttributes.$valid) {
              $scope.upload(image, postQuestionAttributes);
          }
      };
  
      $scope.upload = function(file, postQuestionAttributes) {
          Upload.upload({
              url: 'cms/posts',
              fields: postQuestionAttributes,
              file: image
          }).progress(function (evt) {
              var progressPercentage = parseInt(100.0 * evt.loaded / evt.total);
              console.log('progress: ' + progressPercentage + '% ' + evt.config.file.name);
          }).success(function (data, status, headers, config) {
              console.log('file ' + config.file.name + 'uploaded. Response: ' + data);
          }).error(function (data, status, headers, config) {
              console.log('error status: ' + status);
          })
      };
  }]);
  </code></pre>
  
  <p>Here is my form:</p>
  
  <pre><code>&lt;form accept-charset="UTF-8" name="form.postQuestionForm" ng-submit="submit(postQuestion, image)" class="new_post_item" novalidate&gt;
      &lt;input name="utf8" type="hidden" value="✓"&gt;
      &lt;input name="authenticity_token" type="hidden" ng-model="postQuestion.token" ng-init="postQuestion.token='&lt;%= form_authenticity_token %&gt;'"&gt;
      &lt;input name="employer_id" type="hidden" ng-model="postQuestion.employer_id" ng-init="postQuestion.employer_id='&lt;%= current_employer.id %&gt;'"&gt;
  
      &lt;div class="form-group"&gt;
          &lt;label&gt;Question&lt;/label&gt;
          &lt;textarea class="question-textbox" name="question" ng-model="postQuestion.question" required&gt;&lt;/textarea&gt;
      &lt;/div&gt;
  
      &lt;div class="form-group"&gt;
          &lt;label&gt;Image&lt;/label&gt;
          &lt;div class="button" ngf-select ng-model="image" name="image" ngf-pattern="image/*" accept="image/*" ngf-max-size="150KB" required&gt;Select&lt;/div&gt;
      &lt;/div&gt;
  
      &lt;div class="form-group"&gt;
          &lt;label&gt;Publish Question&lt;/label&gt;
          &lt;select class="" name="published" ng-model="postQuestion.published" required&gt;
              &lt;option value="true"&gt;Publish&lt;/option&gt;
              &lt;option value="false"&gt;Don't Publish&lt;/option&gt;
          &lt;/select&gt;
      &lt;/div&gt;
  
      &lt;input class="submit-btn" name="commit" type="submit" value="Publish Post" ng-disabled="form.postQuestion.$invalid"&gt;
  &lt;/form&gt;
  </code></pre>