example - menu angularjs bootstrap

Modal de Ui angular, enviando datos al controlador modal desde $ http

Question

Estoy usando la directiva modal angular-ui http://angular-ui.github.io/bootstrap/ .

He seguido el ejemplo del enlace de arriba.

Estos son mis datos que quiero enviar desde mi controlador:

ProductsFactory.getOneProduct().then(function(d){
$scope.selectedProduct = d.data;
});
$scope.open = function () {
var modalInstance = $modal.open({
controller: ''ModalInstanceCtrl'',
templateUrl: ''productDetail.html'',
resolve: {
items: function () {
return $scope.selectedProduct;
}
}
});
};

Y este es mi controlador modal:

var ModalInstanceCtrl = function ($scope, $modalInstance, selectedProduct) {
console.log(selectedProduct);
$scope.ok = function () {
$modalInstance.close();
};
$scope.cancel = function () {
$modalInstance.dismiss(''cancel'');
};
};

El problema es que no puedo acceder al "producto seleccionado" en mi controlador modal. Sé que la razón es algo para hacer una llamada asíncrona de ancho y solo se puede acceder desde la GUI. ¿Pero cómo resuelvo este problema? ¿Cómo envío el "$ scope.selectedProduct" a mi ModalInstanceCtrl?

Answer 1

Puedes probar algo como

$scope.open = function () {
var modalInstance = $modal.open({
controller: ''ModalInstanceCtrl'',
templateUrl: ''productDetail.html'',
resolve: {
items: function () {
return ProductsFactory.getOneProduct();
}
}
});
};

Básicamente, su $modal puede tomar una promesa, entonces ¿por qué no usarlo? Ahora el objeto debería estar disponible en el controlador cuando la promesa se resuelva. El ModalInstanceCtrl debe ser

var ModalInstanceCtrl = function ($scope, $modalInstance, items) {

ya que está resolviendo la propiedad items no la propiedad selectedProduct .