Creating a Template with Inputs via a Directive in AngularJS

gistfile1.js

(function(angular) {
  'use strict';

  angular.module('myapp.directives').directive('myCustomTemplate', function() {
    return {
      restrict: 'E',
      templateUrl: 'shared/my_custom_template.html', // markup for template
      scope: {
        myList: '=',        // Attribute used to pass an array of objects to render via the template: data-my-list="myList"
        myConditional: '=', // Attribute used to specify some conditional state in template: data-my-conditional="false"
        doSomething: '&',   // Attribute used to link outer scope function to inner context of template: data-do-something="outerScopeMethod(listItem)"
      }
    };
  });
})(window.angular);

my_custom_template.html

<div class="my-custom-template-container" data-ng-if="myList.length > 0">
  <table class="my-custom-template-table" role="grid">
    <thead>
      <tr>
        <th>Name</th>
        <th>Address</th>
        <th>Phone</th>
        <th>&nbsp;</th>
      </tr>
    </thead>
    <tbody>
      <tr data-ng-repeat="row in myList">
        <td data-ng-bind="row.name"></td>
        <td data-ng-bind="row.address"></td>
        <td data-ng-bind="row.phone"></td>
        <td>
          <button data-ng-click="doSomething({listItem: row})">Delete</button>
        </td>
      </tr>
    </tbody>
  </table>
</div>

my_page_template.html

<div>
  <my-custom-template data-my-conditional="true" data-my-list="listForTable" data-do-something="markRowDisabled(row)"></my-custom-templates>  
</div>