Javascript 使用单击调用分配给不同控制器的函数

Javascript 使用单击调用分配给不同控制器的函数,javascript,html,angularjs,Javascript,Html,Angularjs,我有两个控制器,一个控制器用于窗体,当单击窗体的按钮时调用,另一个控制器用于div,使用scope和{{}插入。问题是我需要将表单提交给另一个控制器后收集的数据传递给另一个控制器。如何在第一个控制器的函数中调用第二个控制器的函数: //FIRST CONTROLLER, CALLED BY CLICKING BUTTON app.controller('FormController', function ($scope) { $scope.IdSubmitted = function (

我有两个控制器,一个控制器用于窗体,当单击窗体的按钮时调用,另一个控制器用于div,使用scope和{{}插入。问题是我需要将表单提交给另一个控制器后收集的数据传递给另一个控制器。如何在第一个控制器的函数中调用第二个控制器的函数:

//FIRST CONTROLLER, CALLED BY CLICKING BUTTON
app.controller('FormController', function ($scope) {
    $scope.IdSubmitted = function () {
        $scope.datatokens = json_datatokens;
        //WHERE I NEED TO CALL THE SECOND CONTROLLER, AND PASS IT "json_datatokens"
    }
});

//SECOND CONTROLLER
app.controller('#10Controller', function ($scope) { 

    $scope.datatokens = json_datatokens;    
});
HTML:

#FORM
<div ng-controller="FormController">
    <form class="search-wrapper" onsubmit='load_button();fetch_data();return false;'>
        <input type="text">
        <button type="submit" class="button " ng-click="IdSubmitted()">Submit Info</button>
    </form>

#DIV
        <div ng-controller='#10Controller' ng-init="init()">
            <p>Your payment is {{datatokens["DB.PMT"]}}</p>
        </div>
#表单
提交信息
#DIV
您的付款是{{datatokens[“DB.PMT”]}


有几个选项-

  • 使用两个控制器都引用的共享对象(我更喜欢工厂;您也可以使用服务)。让第一个控制器设置共享对象中的数据,第二个控制器可以读取该数据。
    例如—

    app.factory('sharedStuffFactory', function() {
      return {
         sharedData: null; //that will be filled be one of the controllers
      }
    });
    
  • app.controller('FormController',函数($scope,sharedStuffFactory){
    $scope.IdSubmitted=函数(){
    $scope.datatokens=json_datatokens;
    sharedStuffFactory.sharedData=json_数据令牌;
    }
    });
    app.controller(“#10Controller”,函数($scope,sharedStuffFactory){
    $scope.datatokens=sharedStuffFactory.sharedData;
    });

  • 如果您稍微更改一下html结构,将第二个div放在第一个div中,您可以在它们之间共享一个范围
    除了Sjonny建议的选项外,您还可以将广播与以下内容结合使用

    app.controller('FormController', function ($scope) {
        $scope.IdSubmitted = function () {
            $scope.$emit('formSubmission', json_datatokens);
        }
    });
    
    app.controller('#10Controller', function ($scope) { 
        $scope.$on('formSubmission', function(event, data) {
            $scope.datatokens = data;
        });  
    });
    

    我想在本例中,我会将第一个$scope.datatokens(在第三行)替换为json_datatokens?是的。如果它已声明并可以使用,您可以将其传递到$scope.$emit,但是我看不到您在哪里为json_datatokens提供了一个值。哦,对了,这是通过GET请求收集的-我不确定它是否相关OK很棒。我已经更新了我的答案,改为使用json_数据令牌。希望有帮助!