将id从一个控制器传递到另一个不同的ng-app文件

时间:2017-09-13 09:14:16

标签: angularjs

我有2个js文件,即collegeApp.js和branchApp.js。我有两个控制器CollegeController.js,它位于collegeApp.js ng-app和BranchController.js里面,它位于branchApp.js ng-app中。

从我的HTML中,我将重定向到另一页。

这是我的 html

<li data-ng-click="getBranchByBranchId(branch.branchId); setBranchId(branch.branchId)">
    {{branch.branchName}}
</li>

这个html页面在collegeApp.js.A单击分支名称后我调用方法而且它的控制器看起来像这样。

CollegeController.js

var CollegeController = function($scope, $rootScope, $http, $location, $route,CollegeService,$routeParams) {

    $rootScope.pageTitle = $route.current.title;

        $scope.getBranchId = function() {
        CollegeService.getBranchId().then(function(response) {
            $scope.branchId = response.data;
        });
    }

    $scope.setBranchId=function(branchId) {
      CollegeService.setBranchId(branchId);
    $rootScope.passBranchId = branchId;
      window.location.href="./branch?
      branchId='+$rootScope.passBranchId";//Here I am redirecting to branch page with id.//
    }
}

分支页面位于branchApp.js中,上面的代码位于collegeApp.js中。 现在在BranchController.js中我试图捕获从上一页发送的branchId。

BranchController.js

var BranchController = function($scope, $rootScope, $http, $location, $route,BranchService,$routeParams) 
    {
      $scope.branchId = $rootScope.passBranchId;//Here i am trying to get branchId//
      console.log($scope.branchId);//I am getting undefined.
    }

我试过$ rootScope,$ routeParams.But没有一个工作。 有没有什么方法可以将branchId从collegeApp传递给branchApp?或者我错过了什么?

3 个答案:

答案 0 :(得分:1)

重定向页面时使用$location.path('/branch/' + branchId) 另外,您的控制器中已经有$location

然后,您需要使用$routeParams在网址中找到ID。

更新路由配置以查找params,应该如下所示

  $routeProvider
  ...  
  .when('branch/:branchId', {
        templateUrl: 'views/branches.html',
        controller: 'BranchController'
  })

然后得到像这样的值

$scope.branchId = $routeParams.branchId;

答案 1 :(得分:1)

我意识到你想在同一个应用程序中的多个模块之间共享信息。以下是测试场景的完整代码示例。

/**
 * Service definition which holds the passed values
 */
angular.module('myapp')
.config('collegeService', collegeService);
collegeService.$inject = [];

function collegeService() {
    var branchId = null;

    return {
        getBranchId:    getBranchId,
        setBranchId:    setBranchId
    };

    function getBranchId() {
        /**
         * Implement a promise based approach if the branch ID reads from an external source
         * else just return it as given below
         */
        return branchId;
    }

    function setBranchId(brId) {
        branchId = brId
    }
}

/**
 * First controller definition
 */
angular.module('myapp')
.controller('CollegeController', CollegeController);
CollegeController.$inject = ['$scope', 'collegeService'];

function CollegeController($scope, collegeService) {

    $scope.getBranchId = function() {
        /**
         * Use promise based approach as below if the read method returns a promise
         */
        collegeService.getBranchId().then(function(response) {
            $scope.branchId = response.data;
        });

        /**
         * Uses a simple approach as below if the read method returns the value
         */
        // $scope.branchId = collegeService.getBranchId();
    };

    $scope.setBranchId = function(branchId) {
        CollegeService.setBranchId(branchId);
    }
}

/**
 * Second controller definition
 */
angular.module('myapp')
.controller('BranchController', BranchController);
BranchController.$inject = ['$scope', 'collegeService'];

function BranchController($scope, collegeService) {
    $scope.init = function() {
        $scope.branchId = collegeService.getBranchId();
    };

    /**
     * Invokes the init method during the Controller getting instantiated
     */
    $scope.init();
}

答案 2 :(得分:1)

我终于找到了解决方案。我刚刚添加了这一行并且有效。

Inside SchoolController.js

    $scope.setBranchId=function(branchId)
    {
      window.localStorage.setItem("branchId", branchId); 
    }

在BranchController.js

    $scope.branchId =   window.localStorage.getItem("branchId");

现在我可以在控制器中的任何地方使用Id,并且我也可以将id从collegeApp.js传递到branchApp.js ng-apps。