从另一个AngularJS控制器获取数据 [英] Getting Data From Another AngularJS Controller

问题描述

所以我还是非常新的在Ionic / Cordova / AngularJS开发。

现在我有2个控制器，组和事件。我的目标是创建一个组并在单独的页面上创建一个事件。创建群组后，我希望用户能够在其创建活动屏幕中选择此群组。但是，我只是不能让我的团体出现。我认为一个简单的ng控制器选项在我的HTML选项字段将做到，但似乎不可能。我试图把一切都在同一个控制器，工作，但这很容易变得非常混乱。任何人都能告诉我如何实现这一点？谢谢！

 < label class =item item-input item-select> 
< div class =input-label> 
 Group 
< / div> 
< select ng-model =event.groupname> <！ - 这在我的eventscontroller  - > 
< option ng-repeat =group in groups> {{group.name}}< / option> <！ - 这些组在GroupsController中，这不工作 - > 
< / select> 
< / label> 
  

解决方案

您可以使用服务在控制器之间共享数据。服务为我们在我们的应用程序中共享数据和功能提供了一个简单的方法。

我建议您阅读这篇文章如何在AngularJS的控制器之间共享数据。

$ b

这里是您可以尝试的实施

$ c><！ - SharedService - >
< script type =text / javascript>
angular.module（'myApp'）
.service（'SharedService'，[function（）{
var main = {};
main.eventGroupName ='';

main.getEventGroupName = function（）{
return main.eventGroupName;
};
main.setEventGroupName = function（groupName）{
main.eventGroupName = groupName;
};

return main;
}]）;
< / script>

<！ - GroupsController - >
< script type =text / javascript>
angular.module（'myApp'）
.controller（'GroupsController'，['$ scope'，'sharedService'，function（$ scope，SharedService）{
$ scope.event。 groupname = SharedService.getEventGroupName（）;
// GroupsController的剩余代码
//
//
}]）;
< / script>

<！ - Eventscontroller - >
< script type =text / javascript>
angular.module（'myApp'）
.controller（'EventsController'，['$ scope'，'sharedService'，function（$ scope，SharedService）{
var groupName ='Another name $;
SharedService.setEventGroupName（groupName）;
// Eventscontroller的剩余代码
//
//
}]）;
< / script>

<！ - 查看 - >
< label ng-controller =GroupsControllerclass =item item-input item-select>
< div class =input-label>
Group
< / div>
< select ng-model =event.groupname> <！ - 这在我的EventsController - >
< option ng-repeat =group in groups> {{group.name}}< / option> <！ - 这些组在GroupsController中，这不工作 - >
< / select>
< / label>

So I'm still very new to developing in Ionic/Cordova/AngularJS.

Right now I have 2 controllers, "groups" and "events". My goal is to create a group and to create an event on seperate pages. Once a group is created, I want users to be able to select this group in their "create event" screen. However, I just can't get my groups to show up. I thought a simple ng-controller option in my HTML option field would do it but that doesn't seem to be possible. I tried putting everything in the same controller and that works, but that easily becomes very chaotic. Would anyone be able to tell me how I can achieve this? Thanks!

<label class="item item-input item-select">
                    <div class="input-label">
                        Group
                    </div>
                        <select ng-model="event.groupname"> <!-- this is in my eventscontroller-->
                            <option ng-repeat="group in groups">{{group.name}}</option> <!-- these groups are in GroupsController, this doesn't work -->
                        </select>
                </label>

解决方案

You can use a service to share data between your controllers. Services provide an easy way for us to share data and functionality throughout our app.

I'd recommend you to go through this article on how to share data between controllers in AngularJS.

Here is the implementation you can try

<!-- SharedService -->
<script type="text/javascript"> 
    angular.module('myApp')
    .service('SharedService', [function () {
        var main = {};
        main.eventGroupName = '';

        main.getEventGroupName = function(){
            return main.eventGroupName;
        };
        main.setEventGroupName = function(groupName){
            main.eventGroupName = groupName;
        };

        return main;    
    }]);
</script>

<!-- GroupsController -->
<script type="text/javascript"> 
    angular.module('myApp')
    .controller('GroupsController', ['$scope', 'sharedService', function ($scope, SharedService) {
        $scope.event.groupname = SharedService.getEventGroupName();
        // Remaining code for GroupsController
        //
        //
    }]);
</script>

<!-- Eventscontroller -->
<script type="text/javascript"> 
    angular.module('myApp')
    .controller('EventsController', ['$scope', 'sharedService', function ($scope, SharedService) {
        var groupName = 'Another name';
        SharedService.setEventGroupName(groupName);
        // Remaining code for Eventscontroller
        //
        //
    }]);
</script>

<!-- View -->
<label ng-controller="GroupsController" class="item item-input item-select">
    <div class="input-label">
        Group
    </div>
        <select ng-model="event.groupname"> <!-- this is in my EventsController-->
            <option ng-repeat="group in groups">{{group.name}}</option> <!-- these groups are in GroupsController, this doesn't work -->
        </select>
</label>

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