使用AngularJS添加/編輯數據的最佳做法

我目前正在開發一個使用AngularJS的SPA應用程序，允許最終用戶通過表單添加&編輯訂單。使用AngularJS添加/編輯數據的最佳做法

我想知道的是什麼被認爲是確定應用程序是否在Edit或Create狀態的最佳做法？

例如，當我點擊一個菜單項，顯示'添加新訂單'時，我希望顯示一個名爲`order.html'的部分視圖，其中所有輸入欄位均爲空白。如果可能的話，我還想在編輯訂單時重新使用這個相同的視圖，其中從正在編輯的當前訂單預填充輸入字段。

我需要使用service/factory對於這一點，有一個屬性，以確定狀態，例如：

angular.module('app') 
    .factory('orderService', ['$http', function($http) { 
     var state = { 
      addOrder: false, 
      order: { 
       orderRef: "", 
       orderDate: "" 
      } 
     }; 
    }]);

然後，我可以根據編輯狀態從相關控制器設置addOrder財產，以及作爲addOrder: true時填寫order屬性與訂單的詳細信息。

我看了一下網絡，不幸的是這樣的例子似乎很少。

來源

2015-02-09 Intrepid

我目前正在使用一項服務（DataRepo），它存儲了您想要全局保留的所有數據。例如，您有一個input，用戶可以在其中鍵入關於其順序的一些旁註，如果他們導航回該站點，他們可能會再次看到他們的文本。

<input type="text" ng-model="DataRepo.orderNotes">

在你的控制器，你注入你的DataRepo服務並將其綁定到範圍：

$scope.DataRepo = DataRepo;

通過這樣做，用戶輸入將被自動存儲到DataRepo服務。

來源

2015-02-09 13:19:45 DonJuwe

該解決方案看起來正是我打算做的。所以基本上我可以在服務上創建一些方法，例如'addOrder（）'將addOrder屬性設置爲'true'並擦除'order'對象;和'editOrder（order）'將把'addOrder'屬性設置爲'false'，然後從'order'參數填充'order'屬性？ – Intrepid 2015-02-09 13:32:27

當然，您可以使用整個對象和函數來填充此服務，以更好地處理數據。我只是想舉一個我如何處理這個問題的簡單例子。 – DonJuwe 2015-02-09 13:37:31

使用AngularJS添加/編輯數據的最佳做法

回答

相關問題