var bookApp = angular.module('bookApp', ['ngResource','ngRoute']);

bookApp.config(['$routeProvider', function ($routeProvider) {
    $routeProvider.when('/', {templateUrl: 'book-list.html',   controller: 'BookListCtrl'});
}]);

<!DOCTYPE html>
<html ng-app="bookApp">

  <head>
    <meta charset="utf-8" />
    <title>AngularJS Plunker</title>
    <link data-require="bootstrap-css@*" data-semver="3.0.3" rel="stylesheet" href="https://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css" />
    <script>document.write('<base href="' + document.location + '" />');</script>
    <link rel="stylesheet" href="style.css" />
    <script data-require="angular.js@1.2.x" src="https://code.angularjs.org/1.2.4/angular.js" data-semver="1.2.4"></script>
    <script data-require="angular-resource@*" data-semver="1.2.1" src="https://code.angularjs.org/1.2.1/angular-resource.js"></script>
    <script data-require="angular-route@1.2.0-rc2" data-semver="1.2.0-rc2" src="https://code.angularjs.org/1.2.0-rc.2/angular-route.js"></script>
    <script data-require="jquery@*" data-semver="2.0.3" src="https://code.jquery.com/jquery-2.0.3.min.js"></script>
    <script data-require="bootstrap@2.3.2" data-semver="2.3.2" src="https://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script>
    <script src="app.js"></script>
    <script src="controllers.js"></script>
    <script src="services.js"></script>
    <script src="filters.js"></script>
  </head>

  <body>
    <div ng-view=""></div>
  </body>

</html>

/* app css stylesheet */

body {
    background-color: rgb(249, 248, 249);
}

#myForm {
    padding-top:25px;
    margin-left:25px;
}
    
bookApp.controller('BookListCtrl', function ($scope, BookService) {
    $scope.searchTerm = "jQuery";

    $scope.doSearch = function () {
        BookService.get({ q: $scope.searchTerm }, function (response) {

            $scope.bookResults = response.items;
            $scope.orderProp = 'volumeInfo.title';
            
        });
    }
});
bookApp.filter('formatFilter', function() {
  return function(text) {
    if (text !== null) {
      for (var i in text) {
        var authors = text[i];
      }
      return authors;
    }
  };
});


bookApp.filter('dateFilter', function() {
  return function(text) {
    if (text !== null) {
      var d = new Date(text);
      var day = d.getDate();
      var month = d.getMonth() + 1;
      var year = d.getFullYear();
      return (month + "/" + day + "/" + year);
    }
  };
});
bookApp.factory('BookService', function ($resource) {
    return $resource('https://www.googleapis.com/books/v1/volumes',
        {maxResults: '40', callback: 'JSON_CALLBACK', key: 'AIzaSyATldFLGtPPZVLecasP0nFXkX6RqXa7VEI'},
        { get: { method: 'JSONP' }
        });
});

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
   <head>
      <title></title>
   </head>
   <body>
      <div class="container-fluid" style="padding-left: 10px">
         <h2 id="hdr"></h2>
         <form id="myForm" class="form-inline form-search" name="myForm">
            <label>Search for 
            <input id="in" type="text" ng-model="searchTerm" class="search-query input-medium" />
            </label> 
            <label>
               Sort by: 
               <select id="option" ng-model="orderProp">
                  <option value="volumeInfo.authors">Alphabetical by Author</option>
                  <option selected="selected" value="volumeInfo.title">Alphabetical by Title</option>
               </select>
            </label>
            <button class="btn btn-primary" ng-click="doSearch()"> Search</button>
            <label>Sub-Query <input id="subquery" type="text" ng-model="SubQuery" class="search-query input-medium" /></label>
         </form>
         <table id="resultsTbl" class="table table-striped">
            <thead>
               <tr>
                  <th></th>
               </tr>
            </thead>
            <tbody>
               <tr ng-repeat="item in bookResults| filter:SubQuery | orderBy:orderProp">
                  <td><a ng-href="{{item.volumeInfo.infoLink}}" target="_blank"><img ng-src=
                     "{{item.volumeInfo.imageLinks.smallThumbnail}}" /></a></td>
                  <td>{{item.volumeInfo.title}}<br />
                     By: {{item.volumeInfo.authors | formatFilter}}<br />
                     Published: {{item.volumeInfo.publisher}}, {{item.volumeInfo.publishedDate |
                     dateFilter}}
                  </td>
               </tr>
            </tbody>
         </table>
      </div>
   </body>
</html>