在Angular JS中的控制器之间传递数据?

我有一个显示产品的基本控制器，

App.controller('ProductCtrl',function($scope,$productFactory){
     $productFactory.get().success(function(data){
           $scope.products = data;
     });
});

在我看来，我是在一个列表中显示这些产品

<ul>
    <li ng-repeat="product as products">
        {{product.name}}
    </li>
</ul

我试图做的是，当有人点击产品名称时，我有另一个名为购物车的视图，该产品被添加。

 <ul class="cart">
      <li>
          //click one added here
      </li>
      <li>
          //click two added here
      </li>
 </ul>

我的疑问是，如何将点击的产品从第一个控制器传递到第二个控制器?我认为cart也应该是一个控制器。

我处理点击事件使用指令。我也觉得我应该使用服务来实现上述功能，只是不明白如何?因为购物车将被预定义的产品数量添加可能是5/10取决于哪个页面的用户。所以我想保持它的一般性。

更新:

我创建了一个广播服务，在第二个控制器我接收它。现在的问题是如何更新dom?因为我的产品清单是硬编码的。

当前回答

我认为最好的方法是使用$localStorage。(一直工作)

app.controller('ProductController', function($scope, $localStorage) {
    $scope.setSelectedProduct = function(selectedObj){
        $localStorage.selectedObj= selectedObj;
    };
});

你的cardController将是

app.controller('CartController', function($scope,$localStorage) { 
    $scope.selectedProducts = $localStorage.selectedObj;
    $localStorage.$reset();//to remove
});

您还可以添加

if($localStorage.selectedObj){
    $scope.selectedProducts = $localStorage.selectedObj;
}else{
    //redirect to select product using $location.url('/select-product')
}

2017-07-28 07:19:22

其他回答

为了改进@Maxim提出的使用$broadcast的解决方案，发送数据不改变

$rootScope.$broadcast('SOME_TAG', 'my variable');

而是监听数据

$scope.$on('SOME_TAG', function(event, args) {
    console.log("My variable is", args);// args is value of your variable
})

2017-01-04 15:04:33

仅供参考 $scope对象有$emit， $broadcast， $on 和 $rootScope对象具有相同的$emit， $broadcast， $on

点击这里阅读更多关于angular中发布/订阅设计模式的内容

2015-11-17 18:04:57

在控制器之间共享数据的一个更简单的方法是使用嵌套的数据结构。而不是，例如

$scope.customer = {};

我们可以用

$scope.data = { customer: {} };

data属性将从父作用域继承，因此我们可以覆盖它的字段，保持来自其他控制器的访问。

2014-10-16 10:29:05

angular.module('testAppControllers', [])
    .controller('ctrlOne', function ($scope) {
        $scope.$broadcast('test');
    })
    .controller('ctrlTwo', function ($scope) {
        $scope.$on('test', function() {
        });
    });

2016-01-26 08:32:33

有三种方法，

A)使用服务

b)利用控制器作用域间依赖的父/子关系。

c)在Angular 2.0中，“As”关键字将把数据从一个控制器传递到另一个控制器。

如需更多信息，请查看以下链接:

http://www.tutorial-points.com/2016/03/angular-js.html

2016-03-18 07:47:54

在Angular JS中的控制器之间传递数据?

推荐文章

最新文章

标签