update

app/controllers/bookdetails.controller.js

@@ -4,12 +4,44 @@
 
     app.controller('BookDetails', ['$scope', 'books.repository', '$routeParams', function ($scope, booksRepository, $routeParams)
             {
+                var details = {};
                 booksRepository.getBookById($routeParams.id)
                 .then(function(response) {
-                    console.log(response.data);
+                    $scope.details = response.data;
+                    $scope.details.date = new Date($scope.details.date)
+                    console.log($scope.details)
                 }, function(error) {
                     alert(error)}
                     )
+
+                $scope.isEditeMode = false;
+                $scope.edite = function(){
+                    $scope.isEditeMode = true;
+                    details = angular.copy($scope.details)
+                }
+                $scope.noEdite = function(){
+                    $scope.isEditeMode = false;
+                    $scope.details = angular.copy(details)
+                }
+                booksRepository.getAuthors()
+                .then(function(response){
+                    $scope.authors = response.data.map(function(author){
+                        return {
+                            id: author.id,
+                            name: author.firstname + ' ' + author.lastname
+                        }
+                    })
+                })
+                $scope.save = function(){
+                    booksRepository.updateBookById($scope.details.id, $scope.details)
+                    $scope.isEditeMode = false;
+                };
+                $scope.getAuthorsById = function(id){
+                    if(!$scope.authors || !id) return;
+                    return $scope.authors.filter(function(item){
+                        return item.id === id;
+                    })[0].name;
+                }
             }
         ]);
 }

app/services/books.factory.js

@@ -6,17 +6,23 @@ app.factory('books.repository', ['webApi', '$http', function(webApi, $http) {
 	return {
 		getBooks: _getBooks,
 		getBookById: _getBookById,
-		//updateBookById: _updateBookById
+		getAuthors: _getAuthors,
+		updateBookById: _updateBookById
 	};
 
 	function _getBooks() {
 		return $http.get(webApi.DOMAIN + '/api/v2/books');
-	}
+	};
 
 	function _getBookById(id) {
 		return $http.get(webApi.DOMAIN + '/api/v2/books/' + id);
-	}
-
+	};
+	function _getAuthors() {
+		return $http.get(webApi.DOMAIN + '/api/v2/authors');
+	};
+	function _updateBookById(id, book) {
+		return $http.put(webApi.DOMAIN + '/api/v2/books/' + id, book);
+	};
 }]);
 
 })();

app/views/books-details.template.html

@@ -1 +1,33 @@
-<h2>Book Details</h2>
+<h1 class='page-header'>Book Details</h1>
+<div class="book-details" ng-if='!isEditeMode'>
+    <button class="btn-primary"  ng-click="edite()"><i class="glyphicon glyphicon-pencil"></i></button>
+    <h3>{{details.title}}</h3>
+    <h3>Author: {{getAuthorsById(details.author_id)}}</h3>
+    <span>({{details.date}})</span>
+    <span><i class="glyphicon glyphicon-heart">{{details.rate}}</i>${{details.cost}}</span>
+    <img ng-src='{{details.image || "./app/img/noBook.png"}}' class="imgDetail">
+    <p>{{details.intro}}</p>
+</div>
+<div class="edite-detail" ng-if='isEditeMode'>
+        <button class="btn-success"  ng-click="save()"><i class="glyphicon glyphicon-pencil"></i></button>
+        <button class="btn-danger"  ng-click="noEdite()"><i class="glyphicon glyphicon-remove"></i></button>
+        <div class="form-group">
+            <label for="title"></label>
+            <input type="text" class="form-control" ng-model='details.title' id="title">
+        </div>
+        <div class="form-group">
+            <label for="date"></label>
+            <input type="date" ng-model='details.date' class="form-control" id="date">
+        </div>
+        <div class="form-group">
+            <label for="text"></label>
+            <textarea type="text" ng-model="details.intro"  class="form-control" id='text' rows="10" ></textarea>
+        </div>
+        <div class="form-group">
+                <label for="text"></label>
+                <select ng-model="details.author_id" ng-options="author.id as author.name for author in authors">
+
+                </select>
+        </div>
+        
+</div>