如何在angularjs中使用ngStorage

Question

訪問https://github.com/gsklee/ngStorage。

我的代碼有2個partials，在partial1中我有3個輸入框，輸入的數據是'abc'，'pqr'，'xyz'，點擊按鈕我想要重定向到partial2，其中輸入框在控制器'abcpqr'，'abxy'中計算出以下詳細信息。

這兩個partials使用localStorage [ngStorage]並在控制器中這些值得到計算，並通過點擊按鈕[ng-click =「functionName（）」]被推到partial2。該功能具有執行計算的邏輯。這個怎麼做？

在我創建的應用程序中，我在這兩個partials中都有20多個這樣的字段，所以我不想傳遞值，而是讓它們存儲在localStorage中並從那裏訪問。

Answer 1

假設您有ng-model屬性，您試圖在partial1中捕獲所有字段，如下所示。

偏-1

<input type='text' ng-model='pageData.field1' /> 
<input type='text' ng-model='pageData.field2' /> 
<input type='text' ng-model='pageData.field3' /> 

app.js

var myApp = angular.module('app', ['ngStorage']); 

    myApp.controller('Ctrl1', function($scope, $localStorage){ 

     $scope.pageData = {}; 

     $scope.handleClick = function(){ 
      $localStorage.prevPageData = $scope.pageData; 
     }; 

    }); 

    myApp.controller('Ctrl2', function($scope, $localStorage){ 

     $scope.pageData = $localStorage.prevPageData; 

    }); 

偏-2

<p>{{pageData.field1}}</p> 
<p>{{pageData.field2}}</p> 
<p>{{pageData.field3}}</p> 

另一種方法：

但是，如果您只是想將數據從頁面1中的一個控制器發送到頁面2中的另一個控制器，那麼也可以使用服務來完成此操作。

myApp.service('dataService',function(){ 

    var cache; 

    this.saveData = function(data){ 
     cache = data; 
    }; 

    this.retrieveData = function(){ 
     return cache; 
    }; 

}); 

在您的第一個控制器中注入此服務以保存頁面數據並將其重新注入第二個控制器以檢索保存的頁面數據。

myApp.controller('Ctrl1', function($scope, dataService){ 

    dataService.saveData($scope.pageData); 

}); 

myApp.controller('Ctrl2', function($scope, dataService){ 

    $scope.pageData = dataService.retrieveData(); 

});