Twitter Bootstrap 从父控制器调用方法的模态
Twitter Bootstrap Modal to call method from parent controller
我有一个实现了 bootstrap 模态对话框的网页。我想在模式对话框中单击按钮时从主控制器调用一个方法,我想将值传递给该方法。我怎样才能做到这一点。
看看我创建的这个 plnkr:http://plnkr.co/edit/2VuKmVidfMpnkSigeips?p=preview
这就是创建模态对话框的方式:
$scope.onClick = function() {
var modalInstance = $modal.open({
templateUrl: 'content.html',
controller: 'ModalInstanceCtrl',
size: 'sm',
resolve: {
item: function () {
return $scope.item;
}
}
});
modalInstance.result.then(function (returnedInput) { <-- This is where you expect the value passed to modalInstance.close(value).
$scope.test = returnedInput;
}, function() {
// dismissed with cancel button
})
};
我们的想法是在您按下 OK 时调用 close():
$modalInstance.close($scope.myinput);
将数据从模态对话框的控制器传回主控制器。
编辑:
我更新了 plnkr 以展示如何在不关闭模态的情况下直接从模态更改主控制器中项目的状态。本质上,您想从模式中调用一些方法来更改主控制器中对象的状态。
我有一个实现了 bootstrap 模态对话框的网页。我想在模式对话框中单击按钮时从主控制器调用一个方法,我想将值传递给该方法。我怎样才能做到这一点。
看看我创建的这个 plnkr:http://plnkr.co/edit/2VuKmVidfMpnkSigeips?p=preview
这就是创建模态对话框的方式:
$scope.onClick = function() {
var modalInstance = $modal.open({
templateUrl: 'content.html',
controller: 'ModalInstanceCtrl',
size: 'sm',
resolve: {
item: function () {
return $scope.item;
}
}
});
modalInstance.result.then(function (returnedInput) { <-- This is where you expect the value passed to modalInstance.close(value).
$scope.test = returnedInput;
}, function() {
// dismissed with cancel button
})
};
我们的想法是在您按下 OK 时调用 close():
$modalInstance.close($scope.myinput);
将数据从模态对话框的控制器传回主控制器。
编辑: 我更新了 plnkr 以展示如何在不关闭模态的情况下直接从模态更改主控制器中项目的状态。本质上,您想从模式中调用一些方法来更改主控制器中对象的状态。