2つの異なるページで角度コントローラの値を使用する

Question

私は2つの異なるページを持っています。彼らの名前はproduct.phpとなります。buy.php. product.phpの場合はcontrollerProduct、の場合はcontrollerBuyです。

ユーザーはproduct.phpをロードし、59 $を購入する製品を選択します。彼または彼女が製品を選択すると、$scope.setPrice();関数はcontrollerProductで実行されます。

window.ngApp = angular.module('myApp', []); 
window.ngApp.controller('controllerProduct', ['$scope', 
    function ($scope) { 
      $scope.price = null //default 
      $scope.setPrice = function(){ 
       $scope.price = 59; 
      }; 
}]); 

は今、彼または彼女は価格が59 $をされている製品を選択し、finaly購入ボタンをクリックしてbuy.phpページがロードされますようsetPrice機能があること。 buy.phpで

私は、ユーザーにこのような何かを示したい：

は、「ユーザーねえ、あなたがこの製品を購入しようとしている、その価格は{{price}}$です！」。

controllerBuyのcontrollerProductのprice変数を使用するにはどうすればよいですか？

Answer 1

コントローラ間でロジックを共有するたびに、サービスにとっては完璧なシナリオです。

一般的なアプローチは、あなたが単純にブラウザのストレージ上の価格のデータを保存する必要があり、この

//singleton to share logic between controllers 
.service('ShareService', function(){ 
var _price = null; 
this.setPrice = function(price){ 
    _price = price; 
} 
this.getPrice = function(){ 
    return _price; 
} 
}) 

//first controller 
.controller('controllerProduct', function($scope, ShareService){ 
    $scope.setPrice = function(price){ 
    $scope.price = price; 
    ShareService.setPrice(price); 
    }; 
}) 

//second controller 
.controller('controllerBuy', function($scope, ShareService){ 
    //watch changes of the price 
    $scope.$watch(function(){ 
    return ShareService.getPrice() 
    }, function(newVal){ 
    $scope.selectedPrice = newVal; 
    }) 
})