更新ng-repeat中使用的$scope变量

I have a controller HomeworkPageController where I get all the topics from MongoDB using method getAllMainTopics from TopicService. $scope.topics is then used to show all topics. I have a button that open a modal where a new topic is add in MongoDB. The modal is using another controller AddTopicController. How can I update $scope.topics from HomeworkPageController in AddTopicController ? I want to do this because after I close the modal, the list of all topics should be refreshed, it must contain the topic that has been added. I tried to use HomeworkPageController in AddTopicController and then call the method getAllMainTopics but the $scope.topics from html is not updated. Thanks.

我有一个控制器HomeworkPageController，从MongoDB中获取所有的主题，使用TopicService的getallmaintopic方法。美元的范围。然后使用主题来显示所有的主题。我有一个按钮，可以在MongoDB中添加一个新主题。模态是使用另一个控制器AddTopicController。如何更新$scope。来自AddTopicController中的HomeworkPageController的主题?我希望这样做，因为在关闭了模式之后，所有主题的列表都应该被刷新，它必须包含已添加的主题。我尝试在AddTopicController中使用HomeworkPageController，然后调用getallmaintopic方法而不是$scope。不更新来自html的主题。谢谢。

Here is HomeworkPageController:

这是HomeworkPageController:

app.controller('HomeworkPageController', ['$scope','TopicService',
 function ($scope, TopicService) {
     $scope.topics = [];
        $scope.getAllMainTopics = function () {
            TopicService.getAllMainTopics('homework')
                .success(function(data) {
                    $scope.topics = data;
        }
        $scope.addTopic = function () {
           ModalService.openModal({
              template: "templates/addTopic.html",
              controller: 'AddTopicController'
           });
      } 
]);

Here is AddTopicController:

这是AddTopicController:

app.controller('AddTopicController', ['$scope','$controller', '$timeout','TopicService', '$modalInstance',
    function ($scope, $controller, $timeout,TopicService, $modalInstance) {
      var homeworkPageController = $scope.$new();
        $controller('HomeworkPageController',{$scope : homeworkPageController });
        $scope.save = function() {
            TopicService.saveTopic(data)
                .success(function(result){
                    homeworkPageController.getAllMainTopics();
                    $modalInstance.close();
                })   
     }
}]);

Here is the view where I use $scope.topics:

这里是我使用$scope的视图。

 <div class="homework-content-topic-list" ng-repeat="topic in topics">
    <label> {{ topic.subject }} </label>
 </div

2 个解决方案

#1

You should probably keep your list of topics in a service and then inject that service into both controllers. This way you would be able to access and update the topics in both of your controllers. It could look something like

您应该将主题列表保存在服务中，然后将该服务注入两个控制器。这样，您就可以访问和更新两个控制器中的主题。它可以是这样的

app.controller('HomeworkPageController', ['$scope','TopicService',
function ($scope, TopicService) {
 $scope.topics = TopicService.topics;
 // Do stuff here
]);

Then you just need to modify your TopicService to have it's methods work on the stored object.

然后只需修改TopicService，使其方法在存储的对象上工作。

#2

you can solve this by two methods

你可以用两种方法来解决这个问题

1)look at the example given in ui-bootstrap's website. They have given an example that will suit your requirement - plunker. There are three items in the modal - item1, item2, item3. If you select one of those items and click 'ok', the selected item is sent to the main controller through "resolve" attribute in the $scope.open function.

1)看看ui-bootstrap网站上给出的示例。他们给出了一个符合你的要求的例子——柱塞。在模态中有三个项目——item1, item2, item3。如果您选择其中的一个项并单击“ok”，选中的项将通过$范围中的“resolve”属性发送到主控制器。打开功能。

2)You can write a custom service that acts as a bridge to the two controllers and you can write getter and setter methods in the service.

2)您可以编写一个自定义服务，作为两个控制器之间的桥梁，并可以在服务中编写getter和setter方法。

angular.module('app').service('popupPageService', function() {

    var topics;

    var setDetails = function(param) {
        topics = param;
    };

    var getDetails = function() {
        return topics;
    };

    return {
        setDetails: setDetails,
        getDetails: getDetails,
    };
});

call the setDetails function in the AddTopicController and once when you come out of the modal, update your $scope.topics in HomeworkPageController by pushing the new value added (getDetails)

在AddTopicController中调用setDetails函数，当您走出模式时，更新您的$范围。在HomeworkPageController中通过推送新添加的值来获取主题(getDetails)

#1