在AngularJS中,模态框通常是通过第三方库(如ngDialog、ui-bootstrap等)实现的。确定和取消按钮不起作用的问题可能是由于以下原因导致的:
例如,使用ngDialog库实现模态框的确认和取消按钮:
HTML代码:
控制器代码:
app.controller('MyController', function($scope, ngDialog) {
$scope.openModal = function() {
ngDialog.open({
template: 'myModalContent.html',
controller: 'ModalController',
scope: $scope
});
};
});
app.controller('ModalController', function($scope, ngDialog) {
$scope.confirm = function() {
// 确认按钮点击事件
ngDialog.close();
};
$scope.cancel = function() {
// 取消按钮点击事件
ngDialog.close();
};
});
例如,使用ui-bootstrap库实现模态框的确认和取消按钮:
HTML代码:
控制器代码:
app.controller('MyController', function($scope, $uibModal) {
$scope.openModal = function() {
var modalInstance = $uibModal.open({
templateUrl: 'myModalContent.html',
controller: 'ModalController',
scope: $scope
});
};
});
app.controller('ModalController', function($scope, $uibModalInstance) {
$scope.confirm = function() {
// 确认按钮点击事件
$uibModalInstance.close();
};
$scope.cancel = function() {
// 取消按钮点击事件
$uibModalInstance.dismiss('cancel');
};
});
在上述代码中,模态框的确认按钮和取消按钮都绑定了正确的点击事件,点击确认按钮时会关闭模态框,点击取消按钮时会取消模态框的显示。
请注意根据你使用的第三方库和具体代码实现进行相应的调整。