title: How to get data attributes value from child elements in angular controllers
body: <p>Yesterday I start learning <code>AngularJs</code> online. I decided to create some useful stuffs for my new project using <code>Angular</code>. Below is some portion of my hard work :</p>
  
  <p><strong>The HTML Part</strong>   </p>
  
  <pre><code>&lt;div data-ng-controller="DataGrid_Controller"&gt;
      &lt;table class="table table-stripped"&gt;
          &lt;thead&gt;
              &lt;tr&gt;
                  &lt;th data-field="fname"&gt; First Name &lt;/th&gt;
                  &lt;th data-field="lname"&gt; Last Name &lt;/th&gt;
                  &lt;th data-field="email"&gt; Email &lt;/th&gt;
              &lt;/tr&gt;
          &lt;/thead&gt;
          &lt;tbody&gt;
  
          &lt;/tbody&gt;
      &lt;/table&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>The Angular Part</strong></p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
  var app = angular.module('TestApp',[]);
  
  app.controller('DataGrid_Controller', function($scope){
      //var fields = ['fname', 'lname', 'email']; 
      //How can I get the value of data-field attributes in my 'Controller' so that I could use them 
  })
  &lt;/script&gt;
  </code></pre>
  
  <p>How can I get the value of <code>data-attributes</code> from child elements (I don't know either the term <code>element</code> exists or not in angular?) in my controller.</p>
  
  <p>I am 1 day old baby for <code>AngularJs</code> so please show me the right way if you think I am catching the wrong way of doing it. I have used <code>jQuery</code> for years so I am thinking a <code>controller</code> as <code>plugin</code>. Please help me solving the problem.</p>