title: Angular js binding with normal html element
body: <p>I was trying angularjs bind functionality. I had one scenario where i have a form tag inside "ng-app" tag</p>
  
  <pre><code>&lt;form name="CollectMFPToEvaluate" &gt;
      &lt;input type="text" name="name" ng-model="risk.name" ng-show="false"&gt;
  
  &lt;/form&gt;
  </code></pre>
  
  <p>In my app.js file i am writing a factory which will call a normal javascript function to set the value of name field</p>
  
  <pre><code>angularApp.factory('NameFactory', function(){
   return {
      bodyLoaded:function(){
         collectName();
      },
  }; 
  });
  
  var collectName = function(){
      document.CollectMFPToEvaluate.name.value = "stackoverflow"; 
  };
  </code></pre>
  
  <p>After i call my factory in apps.js i try to access the name variable
  app.js</p>
  
  <pre><code>$scope.risk = {
          name : '',
  
  };
  
  NameFactory.bodyLoaded();
       alert("risk = "+$scope.risk.name);
  </code></pre>
  
  <p>I am expecting the alert to print "risk = stackoverflow", but it prints "risk =". 
  Am i missing something if so can anyone please correct me.</p>
  
  <p>Thanks</p>