Angularjs 如何调用api以显示角度模式内的响应

我的主页上显示了一个节点列表，当您单击一个节点的标题时，应打开一个模式以显示该节点的详细信息，我的工作方式如下：

var eventsApp = angular.module('EventsApp.controllers', ['infinite-scroll','ui.bootstrap','ngRoute']);
eventsApp.controller('eventsController', ['$scope','$modal','eventsAPIservice', function($scope, $modal, eventsAPIservice){
    $scope.openModal = function(id, size, animationsEnabled){
            var modalInstance;
            modalInstance = $modal.open({
                animation: animationsEnabled,
                templateUrl: 'templates/eventModal.html',
                controller: 'eventModalInstanceController',
                size: size,
                resolve: {
                    event: function(){
                        /* Here I make the call to the api */
                        eventsAPIservice.getEventById(id).success(function(response){
                            console.log(response);
                            return response;
                        });
                    }
                }
            });
    };
}]);

模态实例如下：

eventsApp.controller('eventModalInstanceController', ['$scope', '$modalInstance', 'event', function($scope, $modalInstance, event){

    $scope.eventDetail = event;
    console.log(event);
    $scope.save = function(param){
        console.log(param);
    };

    $scope.cancel = function(){
        $modalInstance.dismiss('cancel');
    };
}]);

<div class="modal-header">
  <h3 class="modal-title">{{ eventDetail.title }}</h3>
</div>
<div class="modal-body">
  <p>{{ eventDetail.eid }}</p>
  <p>{{ eventDetail.description }}</p>
</div>
<div class="modal-footer">
  <button class="btn btn-primary" ng-click="ok()">OK</button>
  <button class="btn btn-warning" ng-click="cancel()">Cancel</button>
</div>

问题是，当解析上的Iconsole.log（response）时，它正确地显示数据，但它没有作为参数“event”正确地传递给eventModalInstanceController，因此当Iconsole.log（event）时，它在控制台上显示undefined

我的模式模板是：

eventsApp.controller('eventModalInstanceController', ['$scope', '$modalInstance', 'event', function($scope, $modalInstance, event){

    $scope.eventDetail = event;
    console.log(event);
    $scope.save = function(param){
        console.log(param);
    };

    $scope.cancel = function(){
        $modalInstance.dismiss('cancel');
    };
}]);

<div class="modal-header">
  <h3 class="modal-title">{{ eventDetail.title }}</h3>
</div>
<div class="modal-body">
  <p>{{ eventDetail.eid }}</p>
  <p>{{ eventDetail.description }}</p>
</div>
<div class="modal-footer">
  <button class="btn btn-primary" ng-click="ok()">OK</button>
  <button class="btn btn-warning" ng-click="cancel()">Cancel</button>
</div>

{{eventDetail.title}
{{eventDetail.eid}

{{eventDetail.description}}

好啊
取消

---

我的问题是在哪里进行API调用，以及如何将其传递给实例控制器。原因：

它应该是变量

resolve

的可见性，因此如果需要访问

modalInstance

，则必须生成一个可以访问该变量的函数

因此，在你的情况下：

---

我找到了解决方案，只需将所有eventModalInstanceController移动到$modal.open中的“controller”属性中，如下所示：

$scope.openModal = function(selectedEvent, size, animationsEnabled){
            var modalInstance;
            modalInstance = $modal.open({
                animation: animationsEnabled,
                templateUrl: 'templates/eventModal.html',
                controller: function($scope, $modalInstance, event){

                    $scope.event = event;
                    $scope.save = function(param){
                        console.log(param);
                    };

                    $scope.cancel = function(){
                        $modalInstance.dismiss('cancel');
                    };
                },
                size: size,
                resolve: {
                    event: function(){
                        return selectedEvent;

                    }
                }                      
            });
};

---

我不知道这是否是一个好的实践，但它起到了作用。

那么您的意思是eventModalInstanceController应该位于另一个angular.module（）上？对不起，我是新来创建你的演示的