Javascript 从角度模式传递数据';s控制器返回主控制器
事情是这样的。我无法将数据从角度模式传回需要的控制器。下面给出的代码 控制器端Javascript 从角度模式传递数据';s控制器返回主控制器,javascript,angularjs,twitter-bootstrap,controller,modal-dialog,Javascript,Angularjs,Twitter Bootstrap,Controller,Modal Dialog,事情是这样的。我无法将数据从角度模式传回需要的控制器。下面给出的代码 控制器端 'use strict' var DataMod = angular.module('Data', ["angularGrid", 'ui.bootstrap.contextMenu', 'ui.bootstrap']); DataMod.controller('DataController', ['$scope', '$compile', '$uibModal', '$log','$rootScope', '$ht
'use strict'
var DataMod = angular.module('Data', ["angularGrid", 'ui.bootstrap.contextMenu', 'ui.bootstrap']);
DataMod.controller('DataController', ['$scope', '$compile', '$uibModal', '$log','$rootScope', '$http', function ($scope, $compile, $uibModal,$log, $rootScope, $http, ngUtilityService) {
//user first clicks on Add button. A modal opens up. ModalInstanceCtrl is the controller used.
$scope.adduser = function () {
var modalInstance = $uibModal.open({
templateUrl: 'myModalContent.html',
controller: ModalInstanceCtrl
});
//response data should be available here.
};
var ModalInstanceCtrl = function ($scope, $uibModalInstance) {
//ajax call is made is inside this controller and i get a response.
//this response is an object. i need to pass this object back to the adduser function. mentioned it above.
};
}
]);
正如您在上面看到的,这里有一个主控制器。我在里面使用了一个模态,它有自己的控制器。我在modals控制器内进行ajax调用并得到响应
我希望作为结果的响应在adduser函数中可用,以便我可以处理该数据。然而,adduser函数一旦启动,它就会转到ModalInstanceCtrl并在那里结束执行。它根本不会返回adduser函数。我需要一种返回adduser函数的方法
谁能让我知道如何做到这一点。还有如何将对象响应从ModalInstanceCtrl传递到adduser函数内的主控制器 看起来您正在使用角度引导模式,是吗?首先,我将对其进行设置,以便模态控制器与主控制器分离。其次,您缺少将响应从模态传递到主控制器所需的承诺。您可以在此处的文档中阅读有关返回模式实例的信息: 这是Angular Bootstrap plunkr中的示例代码:
用新链接更新答案谢谢。这是否意味着modalInstance.result.then是modals数据将返回的位置,我可以使用此数据执行进一步的操作:?是的,没错。在示例中,selectedItem被分配给主控制器作用域的select属性,现在可以在主控制器中对其进行操作$scope.selected=selectedItem;
angular.module('ui.bootstrap.demo', ['ngAnimate', 'ui.bootstrap']);
angular.module('ui.bootstrap.demo').controller('ModalDemoCtrl', function ($scope, $uibModal, $log) {
$scope.items = ['item1', 'item2', 'item3'];
$scope.animationsEnabled = true;
$scope.open = function (size) {
var modalInstance = $uibModal.open({
animation: $scope.animationsEnabled,
templateUrl: 'myModalContent.html',
controller: 'ModalInstanceCtrl',
size: size,
resolve: {
items: function () {
return $scope.items;
}
}
});
modalInstance.result.then(function (selectedItem) {
$scope.selected = selectedItem;
}, function () {
$log.info('Modal dismissed at: ' + new Date());
});
};
$scope.toggleAnimation = function () {
$scope.animationsEnabled = !$scope.animationsEnabled;
};
});
// Please note that $uibModalInstance represents a modal window (instance) dependency.
// It is not the same as the $uibModal service used above.
angular.module('ui.bootstrap.demo').controller('ModalInstanceCtrl', function ($scope, $uibModalInstance, items) {
$scope.items = items;
$scope.selected = {
item: $scope.items[0]
};
$scope.ok = function () {
$uibModalInstance.close($scope.selected.item);
};
$scope.cancel = function () {
$uibModalInstance.dismiss('cancel');
};
});