我有一个 Controller ,在其中使用模态。请检查这个
'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) {
$scope.adduser = function () {
var modalInstance = $uibModal.open({
templateUrl: 'myModalContent.html',
controller: ModalInstanceCtrl
});
};
//use data value here.
var ModalInstanceCtrl = function ($scope, $uibModalInstance) {
var data = "analog";
$scope.cancel = function () {
$uibModalInstance.dismiss('cancel');
};
};
}
]);
如您所见,用户单击“添加用户”选项卡。添加用户函数被执行并弹出一个模式。我已经完成了一些内部处理。
最后,我想将一个变量“数据”传输回主 Controller 。有人可以给我一个简单的例子来说明如何将数据从模式传输到 Controller 吗?
我看过几个例子,并且理解解决方案将帮助我实现它。但我完全对此感到困惑......
最佳答案
如果您在 DataController 范围内定义 ModalInstanceCtrl,您应该能够使用闭包共享变量。
例如:
var data = {
name:"Foo"
}
$scope.data = data;
var ModalInstanceCtrl = function ($scope, $uibModalInstance) {
//accessing data from the controller using closure.
data.name = "analog";
$scope.cancel = function () {
$uibModalInstance.dismiss('cancel');
};
};
$scope.adduser = function () {
var modalInstance = $uibModal.open({
templateUrl: 'myModalContent.html',
controller: ModalInstanceCtrl
});
};
$scope.processData = function(){
//do something with data
};
$scope.$watch('data', function (old, new){
//if data changed do somthing
});
//if you use data here it will have no value yet.
//use data value here.
您还可以使用服务并让两个 Controller 访问它。模态将更改此服务内变量的状态,并且 DataController 将从服务中获取它。
服务示例如下:
DataMod.Service('Data', function () {
var data = {
FirstName: ''
};
return {
getFirstName: function () {
return data.FirstName;
},
setFirstName: function (firstName) {
data.FirstName = firstName;
}
};
});
关于javascript - 将 Angular 模态数据传递给主 Controller ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35929579/