title: Angular js remove leading & trailing spaces from the input textbox
body: <p>See this Plunkr : <a href="http://plnkr.co/edit/YAQooPn0UERDI5UEoQ23?p=preview" rel="nofollow">http://plnkr.co/edit/YAQooPn0UERDI5UEoQ23?p=preview</a></p>
  
  <p>Type text as "_______what___ever_____" 
   (without quotes &amp; _ represents spaces.)</p>
  
  <p>Angular is removing spaces (from front &amp; back &amp; not in between) from the model (which is my desired behavior), but my textbox is keeping the spaces. </p>
  
  <p>how can I remove the spaces from the textbox also ? i.e. I want the textbox also to reflect the value in model.</p>
  
  <p><strong>Edit:</strong> Better explanation of my needs.</p>
  
  <p><strong>For Eg:</strong> 
  If I typed "___What_Ever____" ( without quote &amp; _ is space), </p>
  
  <p>1) my textbox will show me same what i have typed i.e. "___What_Ever____"</p>
  
  <p>2) while my model will show me "What Ever".</p>
  
  <p>I want my textbox's value also to be as "What Ever".</p>
  
  <p><strong>HTML :</strong></p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html ng-app="app"&gt;
  
    &lt;head&gt;
      &lt;link rel="stylesheet" href="style.css" /&gt;
      &lt;script data-require="jquery@1.9.0" data-semver="1.9.0" src="//cdnjs.cloudflare.com/ajax/libs/jquery/1.9.0/jquery.js"&gt;&lt;/script&gt;
      &lt;script data-require="angular.js@1.0.7" data-semver="1.0.7" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.js"&gt;&lt;/script&gt;
      &lt;script src="script.js"&gt;&lt;/script&gt;
    &lt;/head&gt;
  
    &lt;body ng-controller="MyCtrl"&gt;
      &lt;input type="text" ng-model="modelVal"&gt;
      &lt;br&gt;
      model value is "{{modelVal}}"
    &lt;/body&gt;
  
  &lt;/html&gt;
  </code></pre>
  
  <p><strong>JS :</strong></p>
  
  <pre><code>angular.module('app', [])
    .controller('MyCtrl', function($scope) {
      $scope.modelVal="";
  
    })
  </code></pre>