从AngularJS如何从控制器+模板到另一个控制器+模板传递数据？ [英] From AngularJS how to pass data from a controller+template to another controller+template?

问题描述

我在建设有AngularJS和超薄的PHP框架后端的应用程序，现在我完成了我的第一个表格，并创建了一个路线模板它。现在，当我想我的数据传递到另一个控制器出现我的问题，我需要传递数据到另一个控制器+视图（模板），我不想亵渎我第一种观点既不是它的控制器，所以我真的希望/需要将数据传递到另一个控制器，我可以用我的数据和另一种形式播放（第2形式进行计算和其他的东西）......所以，你可以调用第一个控制器pre保存，而实际数据保存（后端DB）只会发生在第二个控制器+模板。这是我第一次模板视图短的格式如下：

I'm building an application with AngularJS and Slim PHP framework for the backend, now I completed my 1st form and created a route to the template for it. Now my problem arise when I want to pass my data to another controller, I need to pass the data to another controller+view(template), I don't want to pollute my first view neither the controller of it and so I really want/need to pass the data to another controller which I could play with my data and another form (the 2nd form is for calculation and other stuff)...So you can call the first controller a pre-save, while the real data save (backend to DB) will only happen in the second controller+template. Here is a short of my 1st template view that has the form:

<form novalidate id="formAdd" name="formAdd" class="form-horizontal well col-md-7 col-md-pull-5" method="post">
    <fieldset>
        <legend>Transaction form</legend>

        <div class="form-group">
            <label for="symbol" class="col-sm-4 control-label">Symbol</label>
            <div class="col-sm-5 symbols">
                <input type="text" name="symbol" class="form-control" ng-model="trsn.symbol" placeholder="symbol" required />
          </div>  
        </div>                    
        <div class="form-group">
            <label for="accnt_id" class="col-sm-4 control-label">Account</label>
            <div class="col-sm-5">
                <select id="accnt_id" name="accnt_id" ng-model="trsn.accnt_id" class="form-control" required>
                    <option value="">...</option>   
                    <option ng-repeat="account in trsn.accounts" value="{{account.accnt_id}}">{{account.accnt_name}}</option>
                </select>
            </div>
        </div> 
        <!-- ....etc, etc.... -->

        <div class="form-actions col-sm-8 col-sm-offset-4">
            <button type="submit" name="save_btn" class="btn btn-primary" ng-disabled="formAdd.$invalid" ng-click="preSaveTrsn(trsn, formAdd)">Save transaction</button>
            <button type="reset" class="btn btn-default">Cancel</button>
        </div>          
    </fieldset>
</form>

然后用模块和路由应用程序：

then the app with the module and routes:

var investingApp = angular.module('investingApp', ['ngSanitize','ngResource', 'ngRoute'])
    .config(function($routeProvider, $locationProvider) {
        $routeProvider.when('/new-trsn',
            {
                templateUrl: 'templates/StockTransaction.html',
                controller: 'StockTransactionController'
            });
        $routeProvider.when('/presave-trsn',
            {
                templateUrl: 'templates/PreSaveTransaction.html',
                controller: 'PreSaveTrsnController'
            });        
    });

现在我的第一个控制器内是preSAVE功能，里面是空的，因为我不知道该怎么用它做，这样我可以在交易数据发送到下一个控制器+视图：

now inside my first controller is the presave function, which is empty since I don't know what to do with it so that I can send the transaction data to the next controller+view:

investingApp.controller('StockTransactionController', 
    function TransactionController($scope, $http, $location, $compile, $timeout, transactionDataService, dateFilter) {
        // define some default variables
        $scope.trsn = {};
        $scope.trsn.symbol = "";
        ...
        $scope.preSaveTrsn = function(trsn, formAdd) {          
            // what to put in here to transfer data to next controller????
        };

然后我的最后一个控制器，我也没什么在那里还没有，因为我无法接收任何数据....但基本上是我想做的是注入的交易数据（TRSN）这是从1形式/控制器。

and then my last controller, I have also nothing in there yet since I can't receive any data....but basically what I want to inject is the transaction data (trsn) which comes from 1st form/controller.

investingApp.controller('PreSaveTrsnController', 
    function MenuController($scope, $http, trsn) {
        console.debug(trsn);
});

我是否必须把里面的 routeProvider 莫名其妙的东西吗？ ......还是我必须填写我的第一控制器内的东西 preSaveTrsn 函数内部特殊？我与这个很困惑，因为我发现所有的例子都是保存马上数据库，但我不能这样做，我建我的应用程序的方式，它真的成为我穿上'几个原因的第二个控制器上ŧ想我要在这里解释一下....感谢您的帮助下式给出：）

Does I have to put something inside the routeProvider somehow? ...or does I have to fill in something special inside the preSaveTrsn function inside my 1st controller??? I'm quite confused with this since all example I find are for saving right away to database, but I can't do that the way I build my app, it really has to be on the second controller for few reasons which I don't think I have to explain here.... Thanks for any help given :)

推荐答案

您可以创建一个轻量级的服务 - 值

You may create a lightweight service - value

angular.module('investingApp').value('MySharedValue', {});

然后在两个控制器注入它：

And then inject it in both controllers:

TransactionController($scope, $http, $location, $compile, $timeout, transactionDataService, dateFilter, MySharedValue)

而只是为了共享值分配给它。

And just to assign your shared value to it

        $scope.preSaveTrsn = function(trsn, formAdd) {          
            MySharedValue.trsn = trsn;
        };

这篇关于从AngularJS如何从控制器+模板到另一个控制器+模板传递数据？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！