Pure custom simple TABLE in material design, any i

Question

Something like a simple structure with default material design, as i am working with angular + material:

<table>
 <tr>

  <td></td>
  <td></td>

 </tr>
</table>

Answer 1

Make custom directory with table like :

<custom-table>
  <cth>
    <ctd></ctd>
  </cth>
  <ctr>
   <ctd></ctd>
  </ctr>
</custom-table>

Answer 2

Yes, it is possible. Either with an angular view or with a directive. In many cases, a combination of the two are used. AngularJS provides a mechanism for two way data binding. There are several ways in which you could display a table using angularJS. Here is two of the most basic ways to display a table using an angular view/controller.

N.B. This does not provide two-way data binding. ng-model would have to be included to use that.

Example Controller

var myAppModule = angular.module('myApp', []);

myApp.controller('exampleCtrl', ['$scope', function($scope) 
   $scope.exampleOne = 'Display me!';
   $scope.exampleTwo = [
                        {'name': 'Daniel', 'country: 'United Kingdom'},
                        {'name': 'Robert', 'country': 'Norway'}
                       ];
}]);

View

<div ng-controller="exampleCtrl">
    <table> <!-- Example One -->
     <tr>
      <td>{{exampleOne}}</td>        
     </tr>
    </table>
    <table> <!-- Example Two -->
     <tr ng-repeat="info in exampleTwo">
       <td>{{info.name}}</td>
       <td>{{info.country}}</td>
     </tr>
    </table>
</div>

Output

<div ng-controller="exampleCtrl">
    <table> <!-- Example One -->
     <tr>
      <td>Display me!</td>        
     </tr>
    </table>
    <table> <!-- Example Two -->
     <tr>
       <td>Daniel</td>
       <td>United Kingdom</td>
     </tr>
     <tr>
       <td>Robert</td>
       <td>Norway</td>
     </tr>
    </table>
</div>