2014-11-04 88 views
18

我試圖在模型窗口打開時將某些模型數據傳遞給模態窗口。當用戶點擊某個元素時,我希望打開模式窗口並顯示與點擊內容有關的更多詳細信息。Angular-ui模態 - 將數據傳入模態

我創建了一個plunker,它工作的方式除了將數據傳遞到模態窗口之外我想要的。

我試圖通過使用數據NG點擊:

<img ng-src="{{item.picture}}" width="100" ng-click="open(item)"/> 

誰能幫助我?或者指向正確的方向?

回答

29

如何this

我加入了項目的決心

resolve: { 
    items: function() { 
     return $scope.items; 
    }, 
    item: function(){ 
     return size; 
    } 
} 

而在controller我做:注射item

13

我已經在http://plnkr.co/FzU5SOv3pdZmAPAIOzdo爲你製作了一個重磅炸彈。

你想解決你的數據很像你目前的項目。

$scope.open = function (size) { 

var modalInstance = $modal.open({ 
    templateUrl: 'myModalContent.html', 
    controller: 'ModalInstanceCtrl', 
    resolve: { 
    items: function() { 
     return $scope.items; 
    }, 
    size: function() { 
     console.log('size: ', size); 
     return size; 
    } 
    } 
}); 

,並在你的模態控制器確保包括現在已經得到解決大小對象如下:

angular.module('ui.bootstrap.demo').controller('ModalInstanceCtrl', function ($scope, $modalInstance, items, size) { 

    $scope.items = items; 
    $scope.selected = { 
    item: $scope.items[0] 
    }; 
    $scope.size = size; 

    $scope.ok = function() { 
    $modalInstance.close($scope.selected.item); 
    }; 

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

什麼爲我工作後$scope.item = item;是內resolve返回一個對象創建一個對象擁有我想分享的變量。

resolve: { 
    shared: function(){ 
    return { 
     name: 'Spencer', 
     numbers: [1, 2, 3] 
    } 
    } 
} 

要訪問shared對象,請在定義模態實例控制器時包含它。

app.controller('ModalInstanceController', function($scope, shared, $uibModalInstance,