0

自宅に表示されているノードのリストがあり、1 つのノードのタイトルをクリックすると、モーダルを開いてそのノードの詳細を表示する必要があります。私は次のように作業しています。

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');
    };
}]);

問題は、解決時にconsole.log(response)を実行すると、データが正しく表示されますが、パラメーター「イベント」としてeventModalInstanceControllerに正しく渡されないため、 console.log(event)を実行すると undefined が表示されることです。コンソール。

私のモーダルテンプレートはこれです:

<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>

私の質問は、どこで API 呼び出しを行う必要があり、それをインスタンス コントローラーに渡す方法です。

4

2 に答える 2

0

理由:

変数の可視性であるresolve必要があるため、アクセスする必要がある場合modalInstanceは、その変数にアクセスできる関数を生成する必要があります。

だからあなたの場合：

$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);
                    updateEvent(response);
                    return response;
                });
            }
        }
    });

    function updateEvent(response) {
        modalInstance.eventDetail = response
    };
};
于 2015-05-16T01:31:12.860 に答える