我一直在尝试使用工厂中的 uibModal,而不是在我的 Controller 中使用它。出现对话框,单击“确定”后,字段数据将返回到服务,但是,我不知道如何将数据返回到我的 Controller ,并将其添加到我的模型中 有任何指针吗?
这是我的工厂代码:
'use strict';
angular.module('ngTableScopeApp')
.factory('DialogService', function($uibModal){
var DialogService = {};
DialogService.newObj = {};
DialogService.addNewItem = function(template, $q){
this.modalInstance = $uibModal.open({
templateUrl: template,
controller: function($scope, $uibModalInstance){
$scope.ok = function () {
$uibModalInstance.close($scope);
return this.newObj;
};
$scope.cancel = function () {
$uibModalInstance.dismiss('cancel');
return null;
};
}
});
};
return DialogService;
});
这是 Controller 代码:
'use strict';
/**
* @ngdoc function
* @name ngTableScopeApp.controller:MainCtrl
* @description
* # MainCtrl
* Controller of the ngTableScopeApp
*/
angular.module('ngTableScopeApp')
.controller('MainCtrl', function (NgTableParams, DummyData, DialogService) {
var self = this;
self.data = DummyData.generateData(1);
var createUsingFullOptions = function() {
var initialParams = {
count: 10 // initial page size
};
var initialSettings = {
// page size buttons (right set of buttons in demo)
counts: [5, 10, 25, 50],
// determines the pager buttons (left set of buttons in demo)
paginationMaxBlocks: 13,
paginationMinBlocks: 2,
dataset: self.data //DummyData.generateData(1)
};
return new NgTableParams(initialParams, initialSettings);
};
self.customConfigParams = createUsingFullOptions();
self.addNewItem = function(){
DialogService.addNewItem('views/addNewItem.html', self);
};
});
最佳答案
您可以使用 $uibModalInstance
服务上提供的 close
方法,在该方法中您可以在关闭弹出窗口时传递数据。然后您可以利用 result
Promise 对象,该对象在模态关闭时被调用。从 $uibModalInstance.close
方法传递的任何数据都可以在那里使用。确保您返回的是 $uibModal.open
方法返回的 promise 。
工厂
DialogService.addNewItem = function(template, $q){
this.modalInstance = $uibModal.open({
templateUrl: template,
controller: function($scope, $uibModalInstance){
$scope.ok = function () {
$uibModalInstance.close({ data: 'OK Called' });
};
$scope.cancel = function () {
$uibModalInstance.close({ data: 'Cancel Called' });
};
}
});
};
return this.modalInstance;
};
Controller
DialogService.addNewItem('views/addNewItem.html', self)
.result.then(function(data) {
console.log("data", data); // print { data: 'MyCustomData' }
});
模态 Controller
$scope.cancel = function () {
$uibModalInstance.close({data: 'MyCustomData'});
};
关于javascript - 使用工厂中的 $uibModal,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39960246/