回答更新

Question

我有两个控制器具有相同的数据，具体取决于语言选择控制器将加载。当单击列表项目时正在加载，但问题是当其他项目被单击时，角度就绪功能不起作用并且看到之前加载的项目仅

   .controller('EnCtrl', function($scope,sharedCartService) {
var cart = sharedCartService.cart;       
 $scope.menu_items=[
            {"p_id":"1",
             "p_name":"coffe ",
             "p_image_id":"coffe",
             "p_price":"50"
            },
            {"p_id":"2",
             "p_name":"Tea",
             "p_image_id":"Tea",
             "p_price":"50"
            },
            {"p_id":"3",
             "p_name":"Masala",
             "p_image_id":"Masala",
             "p_price":"50"
            }];


            $scope.showProductInfo=function (id,img,name,price) {    
             sessionStorage.setItem('product_info_id', id);
             sessionStorage.setItem('product_info_img', img);
             sessionStorage.setItem('product_info_name', name);
             sessionStorage.setItem('product_info_price', price);
             window.location.href = "#";
         };


         $scope.addToCart=function(id,image,name,price){  
              cart.add(id,image,name,price,1);  
         };  
    })

Kctrl

.controller('kCtrl', function($scope,sharedCartService) {
var cart = sharedCartService.cart;

   $scope.menu_items=[
        { "p_id": "1",
         "p_name": "ಕಾಫಿ",
          "p_image_id": "coffe",
         "p_price": "50"
        },
        { "p_id": "2", 
          "p_name": "ಚಹಾ",
           "p_image_id": "Tea",
         "p_price": "50"
        },
        { "p_id": "3",
         "p_name": "ಮಸಾಲಾ",
        "p_image_id": "Masala",
         "p_price": "50"
        }];     

        $scope.showProductInfo=function (id,img,name,price) {   
         sessionStorage.setItem('product_info_id', id);
         sessionStorage.setItem('product_info_img', img);
         sessionStorage.setItem('product_info_name', name);
         sessionStorage.setItem('product_info_price', price);
         window.location.href = "#";
     };


     $scope.addToCart=function(id,image,name,price){  
          cart.add(id,image,name,price,1);  
     };  
})

产品控制器

.controller('productCtrl', function($scope) {
//onload event
    angular.element(document).ready(function () {
        $scope.id= sessionStorage.getItem('product_info_id');
        $scope.img= "img/"+ sessionStorage.getItem('product_info_img')+".jpg";
        $scope.name= sessionStorage.getItem('product_info_name');
        $scope.price= sessionStorage.getItem('product_info_price');
    });

En.html

 <ion-list ng-repeat="item in menu_items"  >
            <h2  ng-click="showProductInfo(item.p_id,item.p_image_id,item.p_name,item.p_price)" > {{item.p_name}} </h2>
   <p   ng-click="showProductInfo(item.p_id,item.p_image_id,item.p_name,item.p_price)">{{item.p_price}}</p>
        </ion-list>

Productpage.html

<div>
                <p> {{name}}</p>
                <p>{{price}}</p>
                </div>

评论后更新。当点击某个项目时，会显示dataupdate消息。项目信息未获取

controller('EnCtrl', function($scope,sharedCartService,$rootScope) {
var cart = sharedCartService.cart;       
 $scope.menu_items=[
            {"p_id":"1",
             "p_name":"coffe ",
             "p_image_id":"coffe",
             "p_price":"50"
            },
            {"p_id":"2",
             "p_name":"Tea",
             "p_image_id":"Tea",
             "p_price":"50"
            },
            {"p_id":"3",
             "p_name":"Masala",
             "p_image_id":"Masala",
             "p_price":"50"
            }];


            $scope.showProductInfo=function (id,img,name,price) {   
            $rootScope.$broadcast('dataUpdate', {id: id,img: img,name: name,price: price})
             window.location.href = "#";
         };


         $scope.addToCart=function(id,image,name,price){  
              cart.add(id,image,name,price,1);  
         };  
    })

产品控制器

.controller('productCtrl', function($scope,$rootScope) {
$rootScope.$on('dataUpdate', function(data) {
         $scope.id = data.id;
          $scope.img = data.img;
         $scope.name = data.name;
         $scope.price=data.price;
})
})

Plunker演示 https://plnkr.co/edit/zhvBzOzDtgOiTEGjBqAp?p=preview

Answer 1

实际上.ready方法不是Angular函数，而是jqLite方法（或jQuery方法，如果你将它包含在你的页面上;默认情况下，angular使用jqLite但是如果你包含jQuery则会使用它）。 angular.element(document)返回包含在jqLite对象中的元素，ready是此对象的方法。回到主要问题：当DOM完全加载时，只调用一次'ready'方法回调，直到下一页重新加载才会再次调用它。请查看ready method

的文档

您可以在单击处理程序中使用$ rootScope上的数据广播事件，然后在事件侦听器中的另一个控制器中访问此数据。所以在你点击处理程序时这样做：

$rootScope.$broadcast('dataUpdate', {id: id, name: name, img: img, price: price})

在产品控制器中添加此项（将事件数据用于更新的控制器$ scope）：

 $rootScope.$on('dataUpdate', function(data) {
         $scope.id = data.id;
         $scope.img = data.img;
         $scope.name = data.name;
         ...
 });

评论问题后更新

您必须将$rootScope注入您想要使用它的每个控制器：

.controller('EnCtrl', function($scope,sharedCartService, $rootScope) {
...
.controller('productCtrl', function($scope, $rootScope) {

回答更新

我注意到你在点击处理程序中重定向。所以请尝试删除ready处理程序，以便控制器在每次初始化时读取localStorage：

.controller('productCtrl', function($scope) {
        $scope.id= sessionStorage.getItem('product_info_id');
        $scope.img= "img/"+ sessionStorage.getItem('product_info_img')+".jpg";
        $scope.name= sessionStorage.getItem('product_info_name');
        $scope.price= sessionStorage.getItem('product_info_price');
}

Answer 2

@ user3698911，除了@Bartek Fryzowicz的回答，

您可能还想查看：

angular.element

注意角度：

（不建议使用，请使用angular.element（回调）代替 angular.element（文件）。就绪（回调））

角度就绪功能不起作用

2 个答案:

回答更新