在控制器之间传递变量的最佳方式

Best way to pass variables between controllers

本文关键字：最佳 方式 变量 控制器 之间      更新时间：2023-09-26

我使用三个角度控制器：

**Controller1**
var fetchStudentDetails = function(){
    var sDetails = myService.getList(//url-1 here);
    sDetails.then(function (data) {
            $scope.studentData = data.list;
            var studentId = $scope.studentData[0].id;
    });
}
fetchStudentDetails();
$scope.loadSecondLevel = function(){
                $state.go('secondLevel');               
              }

**Controller2**
    var fetchClassDetails = function(){
    var sDetails = myService.getList(//url-2 here);
    sDetails.then(function (data) {
            $scope.classData = data.list;
            var className = $scope.classData[0].name;
    });
    }
    fetchClassDetails();
    $scope.loadThirdLevel = function(){
        $state.go('thirdLevel');                
    }
**Controller3**
   $scope.putStudentDetails = function(){
   // Here I need studentId,className for updateResource
        var sDetails = myService.updateResource(//url-3 here);
        sDetails.then(function (data) {
        });     
    }

我必须将studentId（在Controller1中）、className（在Controller 2中）传递到Controller3中的函数中。我尝试使用$rootScope，它正在工作，但刷新页面时$rootScope值变为空。有人知道怎么做吗？

您的问题可以分为两个方面：

1.如何在控制器之间共享数据
在Angular 1.x中共享数据的最佳实践是使用factory，将共享数据存储在工厂服务中，并向控制器公开访问方法：

factory('DetailData', function(myService, $q){
     var _details;
     function __getDetailData(){
           return details
     }
     function __setDetailData(){
          return myService.getList().then(function(data){
              _details = data;
          })
     }
     return {
         getDetailData: __getDetailData,
         setDetailData: __setDetailData
     }
})

controller('myContrller', function(DetailData, $scope){
    $scope.data = DetailData.getDetailData();
})

2.如何在刷新页面时保持数据，
您可以使用localStorage在页面重新加载期间保持数据的持久性，许多工具&库可以实现这一点，例如ngStorage，或者您可以在每次启动angular应用程序时重置服务器中的数据：

//this would register work which would be performed 
//when app finish loading and ready to start. 
angular.module('app').run(function(DetailData){
    DetailData.setDetailData();
})

取决于您正在解决的问题。有三种选择：

  1. 是将数据保存到$rootScope
  2. 是使用$scope.$emit&CCD_ 5功能
  3. 使用自定义服务存储数据

如果你需要保存数据，那么它可以在整个页面重新加载后使用-localStorage。

嘿，这个问题在Angular JS中的控制器之间传递数据中得到了回答？

但简单的回应是服务。

相关文章：