如何将数据从一个模板传递到AngularJS中的另一个模板

时间:2018-02-21 09:32:16

标签: angularjs

首先,我想说我是编程的新手,也是AngularJS的新手,所以请稍微原谅。

我的问题有点复杂,但我试着尽可能地解释它。起初我想告诉你我正在做什么。 我必须从我的公司扩展当地的“Intrant”,现在我尝试整合关于雇员使用的表格的概述。 我有不同的组和子组已经实现并显示在第一个模板上。我的问题是,在我打开一个新模板后,我无法访问数据,该模板用于显示作为子组的一部分的表单。
在这里,您可以看到我的第一个模板,它显示了所有上层组:

<div class="panel">
<div class="panel-body">
  <h1 class="h3 nomargin">Formulare</h1>
    </div>
</div>
<div class="row">
    <ng-repeat ng-repeat="objFormGroup in arrFormGroups">
        <div class="col-xs-12 col-lg-6">
            <name-form-group data-group="objFormGroup"></name-form-group>
        </div>
    </ng-repeat>
</div>

“objFromGroup”填充在“module.js”中,数据来自我的计算机本地托管的REST服务。 还有一个下拉菜单,打开了“&lt; name-from-group&gt;”,这是指另一个模板:

<nav role="navigation">
    <ul>
        <li class="menu-item-has-children">
            <button id="bdd" class="dropbtn" dropdown-toggle ng-disabled="disabled"><a href="#"><font color="#fff">{{group.name}}<span class="caret"></span></font></a></button>
            <ul class="sub-menu">
                <li ng-repeat="childGroup in group.ChildGroups">
                    <a href="app/templates/wforms/over_view_forms.html">{{childGroup.name}}</a>
                </li>
            </ul>
            <br>    <br>
        </li>
    </ul>
</nav>

这很有效。但现在我想打开第三个模板(over_view_froms)来显示用户点击的子组的一部分表单。但是当我尝试使用从REST服务中提取的数据来显示表单时,它无法正常工作。我也无法在此模板上访问我使用的数据,例如{{childGroups.name}}。 在这里,您可以看到应显示表单的最后一个模板:

<html>
<head>
    <style>
        table, th, td {
            border: 1px solid black;
            border-collapse: collapse;
        }
        th, td {
            padding: 5px;
            text-align: left;
        }
    </style>
</head>
<body>

<table style="width:100%">
    <caption>{{childGroup.name}}</caption>
    <tr>
        <th>Formular</th>
        <th>Format</th>
        <th>Größe</th>
        <th>Stand</th>
    </tr>
    <tr>
        <td>{{group.childGroup.Formulare.name}}</td>
        <td>TEST</td>
        <td>Test</td>
        <td>Test</td>
    </tr>
    <tr>
        <td>Test</td>
        <td>Test</td>
        <td>Test</td>
        <td>Test</td>
    </tr>
</table>

</body>
</html>

module.js:

strehlowIntranet
    .config(['$stateProvider', 'strehlowConfigProvider', function ($stateProvider, strehlowConfigProvider) {
        $stateProvider
            .state('app.formgroups', {
                url: '/formgroups',
                label: 'Formulare',
                template_icon: 'fa fa-file-pdf-o',
                resolve: {
                    objFormGroups: ['FormsService', function (FormsService) {
                        return FormsService.getFormGroups();
                    }]
                },
                views: {
                    'content@app': {
                        templateUrl: 'app/templates/wforms/over_view.html',
                        controller: ['$scope', 'objFormGroups', function ($scope, objFormGroups) {
                            $scope.arrFormGroups = objFormGroups;
                        }]
                    }
                }
            });
       $stateProvider
            .state('app.groupdetail',{
                url: '/groupdetail',
                resolve: {
                    objSingleGroup: ['$stateParams', function ($stateParams) {
                        return $stateParams.group;
                    }]
                },
                views: {
                    'content@app': {
                        templateUrl: 'app/templates/wforms/over_view_forms.html',
                        controller: ['$scope', 'objSingleGroup', function ($scope, objSingleGroup) {
                           $scope.objGroup = objSingleGroup;
                        }]
                    }
                }
            });
    }]);

所以我的问题是如何在这个模板上显示数据。

感谢所有帮助我的人。 (:

0 个答案:

没有答案