title: Populate one input field based on other
body: <p>I am using <code>angular.js</code> in my project. In the template I have :</p>
  
  <pre><code> &lt;div class='form-group'&gt;
     &lt;label&gt;Field 1&lt;/label&gt;
    &lt;input type='text' ng-model='f1' required class="form-control"&gt;
   &lt;/div&gt;
  
  
   &lt;div class='form-group'&gt;
      &lt;label&gt;Field 2&lt;/label&gt;
       &lt;input type='text' ng-model='f1' required class="form-control"&gt;
   &lt;/div&gt;
  </code></pre>
  
  <p>My <code>controller</code> right now is using only one model <code>$scope.f1</code></p>
  
  <p>I want to pre-populate <code>Field 2</code> based on <code>Field 1</code>. But since I am using the same model
  if I write something in <code>Field 2</code> overwrites <code>Field 1</code>.</p>
  
  <p>I don't want this behavior. I should be able to edit <code>Field 2</code> later without affecting <code>Field 1</code>.</p>
  
  <p>Is there a way to achieve this behavior ?</p>