角Js-舉表不刷新添加新的數據後，立即

Question

books.html

<div ng-controller="BookController"> 
     <table datatable="ng" class="row-border hover" ng-table="tableParams"> 
      <thead> 
       <tr> 
        <th>BookID</th> 
        <th>BookName</th> 
        <th>Author</th> 
        <th>ISBNCode</th> 
        <th>NoOfBooks</th> 
        <th>PublishDate</th> 
        <th>NoOfBooksIssued</th> 
        <th>Edit</th> 
        <th>Delete</th> 
       </tr> 
      </thead> 
      <tbody> 
       <tr ng-repeat="book in books"> 
        <td>{{book.BookId}}</td> 
        <td>{{book.BookName}}</td> 
        <td>{{book.Author}}</td> 
        <td>{{book.ISBNCode}}</td> 
        <td>{{book.NoOfBooks}}</td> 
        <td>{{book.PublishDate}}</td> 
        <td>{{book.NoOfBooksIssued}}</td> 
        <td><p data-placement="top" data-toggle="tooltip" title="Edit"><button class="btn btn-primary btn-xs" data-title="Edit" data-toggle="modal" data-target="#edit"><span class="glyphicon glyphicon-pencil"></span></button></p></td> 
        <td><p data-placement="top" data-toggle="tooltip" title="Delete"><button class="btn btn-danger btn-xs" data-title="Delete" data-toggle="modal" data-target="#delete"><span class="glyphicon glyphicon-trash"></span></button></p></td> 
       </tr> 
     </table> 
    </div> 

Bookcontroller.js

"use strict"; 
(function() { 
    angular.module("Bookapp") 
     .controller("BookController", ["$scope", "BookService", 
     function ($scope, bookService) { 
      bookService.getRequest() 
       .then(function (response) { 
        $scope.books = JSON.parse(response); 
       }); 
     }]); 
})(); 



AddBookController.js 

"use strict"; 
(function() { 
    angular.module('Bookapp') 
     .controller('AddBookController', ["$scope", "BookService", 
     function ($scope, bookService) { 
      $scope.save = function (item) { 
       bookService.postRequest(item) 
        .then(function() { 
         location.path("books"); 
       }); 
      } 
     }]); 
})(); 

這兩個JS文件是包含在2個不同的自定義文件母版頁。我也寫了BookService.js。主要內容如下：

"use strict"; 
    (function() { 
     angular.module("Bookapp") 
      .factory("BookService", ["$http", "$q", function ($http, $q) { 
       var baseURL = "http://localhost:27136/api/book"; 
       var getRequest = function (query) { 
        var deferred = $q.defer(); 
        $http({ 
         url: baseURL, 
         method: "GET" 
        }) 
         .success(function (result) { 
          deferred.resolve(result); 
         }) 
         .error(function (result, status) { 
          deferred.reject(status); 
         }); 
        return deferred.promise; 
       }; 
       var getByIdRequest = function (id) { 
        var deferred = $q.defer(); 
        $http({ 
         url: baseURL + "/" + id, 
         method: "GET" 
        }) 
         .success(function (result) { 
          deferred.resolve(result); 
         }) 
         .error(function (result, status) { 
          deferred.reject(status); 
         }); 
        return deferred.promise; 
       }; 
       var postRequest = function (data) { 
        var deferred = $q.defer(); 
        $http({ 
         url: baseURL, 
         method: "POST", 
         data: JSON.stringify(data) 
        }) 
         .success(function (result) { 
          deferred.resolve(result); 
         }) 
         .error(function (result, status) { 
          deferred.reject(status); 
         }); 
        return deferred.promise; 
       }; 
       var updateRequest = function (data, id) { 
        var deferred = $q.defer(); 
        $http({ 
         url: baseURL + "/" + id, 
         method: "PUT", 
         data: JSON.stringify(data) 
        }) 
         .success(function (result) { 
          deferred.resolve(result); 
         }) 
         .error(function (result, status) { 
          deferred.reject(status); 
         }); 
        return deferred.promise; 
       }; 
       var deleteRequest = function (id) { 
        var deferred = $q.defer(); 
        $http({ 
         url: baseURL + "/" + id, 
         method: "DELETE" 
        }) 
         .success(function (result) { 
          deferred.resolve(result); 
         }) 
         .error(function (result, status) { 
          deferred.reject(status); 
         }); 
        return deferred.promise; 
       }; 
       return { 
        getRequest: getRequest, 
        getByIdRequest: getByIdRequest, 
        postRequest: postRequest, 
        updateRequest: updateRequest, 
        deleteRequest: deleteRequest 
       }; 
      }]); 
    })() 

我的問題是，當我點擊我的表，我已經進入必須在表立即更新未在我的情況下發生的書的詳細內容下面的添加按鈕。我有兩個不同的控制器，一個是BookController，它將使用服務方法從數據庫獲取所有書籍的詳細信息並顯示在表格中。另一種是AddBookController將新書詳細信息添加到table.In AddBookController本身我寫的代碼發佈它DB後得到的數據。但我無法用新數據刷新表格。請幫助我。非常感謝你提前！所有的

Answer 1

首先，你必須在你的服務代碼味道，因爲你不需要使用$ Q服務價格從$ HTTP檢索一個承諾。

$ HTTP總是返回一個承諾本身！

，因此您可以簡化您的所有功能，像這樣：

var getRequest = function (query) { 
    return $http({ 
     url: baseURL, 
     method: "GET" 
    }); 
}; 

對於你的問題

你有沒有嘗試調試bookService.getRequest()要求？

嘗試把一個的console.log在你的書控制器和看看它是否附加後調用。

也許你需要觸發加後GET請求。

Answer 2

"use strict"; 
(function() { 
    angular.module('Bookapp') 
     .controller('AddBookController', ["$scope", "BookService", 
     function ($scope, bookService) { 
      $scope.save = function (item) { 
       console.log(item); 
       bookService.postRequest(item) 
        .then(function() { 
         bookService.getRequest() 
         .then(function (response) { 
          $scope.books = JSON.parse(response); 
         }); 
       }); 
      } 
     }]); 
})();