lists.template.html

<!-- header -->
<div class="well">
  <div class="container">
    <div class="page-header">
      <h1>Listly - easily store lists</h1>
    </div>
  </div>
</div>

<!-- page content -->
<div class="container">
  <div class="row">

    <div class="col-md-8 col-md-offset-2">

      <!-- new list form-->
      <form class="form-inline" ng-submit="listsCtrl.createList()">
        <div class="form-group">
          <input ng-model="listsCtrl.newListName" type="text" name="list" class="form-control" placeholder="Name" autofocus>
        </div>
        <div class="form-group">
          <input type="submit" class="btn btn-default" value="Create List">
        </div>
      </form>
      <br>

      <!-- list of lists -->
      <ul class="list-group">


        <li class="list-group-item" ng-repeat="list in listsCtrl.lists" ng-click="listsCtrl.showList(list)">

          <!--  description -->
          {{list.name}}

          <div class="pull-right">
            <!-- trash can icon to delete todo -->
             <a ng-click="listsCtrl.deleteList(list, $event);">
              <span class="glyphicon glyphicon-trash"></span>
            </a>
          </div>
        </li>


      </ul>
    </div>
  </div>
</div>