title: How to update data dynamically using Angular
body: <p>I am trying to update the existing data when user select a option from select element using angular framework</p>
  
  <p>I have something like this.</p>
  
  <pre><code>&lt;div&gt;
        &lt;button type="button"&gt;
           {{tests[0].test}} 
       &lt;/button&gt;
       &lt;ul class="dropdown-menu" role="menu"&gt;
          &lt;li ng-repeat='test in tests'&gt;&lt;a href="#/test/{{test.test}}" &gt;{{test.test}}&lt;/a&gt;&lt;/li&gt;
       &lt;/ul&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>My test-controller.js</p>
  
  <pre><code>angular.module('MHApp', ['ngRoute']).
  controller('NavCtrl', ['$scope', function ($scope) {
      $scope.tests = [
               {'test':'test 1', 'link':'t1'},
               {'test':'test 2', 'link':t2'},
               {'test':'test 3', 'link':'t3'},
      ]
  }])
  </code></pre>
  
  <p>Currently the button content is hardcorded using <code>tests[0].test</code> but
  I want the button element contexts get updated when user select the li a tag. The data is actually more complex. Can anyone help me about it? Thanks a lot!</p>
  
  <p>s</p>