我正在尝试使用resolve将数据传递到
ubi modal,这是一个Angular 1.5组件.我知道这是可能的,因为它表明uib模式文档中的组件支持resolve.
component (Type: string,Example: myComponent) – A string reference to
the component to be rendered that is registered with Angular’s
compiler. If using a directive,the directive must have restrict: ‘E’
and a template or templateUrl set.It supports these bindings:
(…)
resolve – An object of the modal resolve values. See UI Router
resolves for details.
我发现的所有示例都在open方法中声明了templateurl / controller.然后将在resolve中声明的项目注入控制器.我将一个Angular 1.5组件传递给模态(不是templateurl / controller),当我尝试从resolve中注入项目时,我遇到了一个可怕的“unknow provider”错误.
这是我的代码.我想通过一个网址.
调用模型的组件控制器
ParentController.$inject = ['$uibModal']; function ParentController $uibModal) { var $ctrl = this; $ctrl.openComponentModal = function(url) { var modalInstance = $uibModal.open({ animation: false,component: "ImageModalComponent",resolve: { url: function() { return url; } } }); }; }
作为模态的组件中的控制器
ImageModalController.$inject = ['url']; function ImageModalController(url) { var $ctrl = this; $ctrl.$onInit = function() { console.log(url); }; }
对于组件,需要将resolve添加到绑定中,然后在隔离范围上提供.换句话说,添加解决方案:’<'在声明组件时. 模态组件
var template = require('./image_modal.component.html'); var ImageModalController = require('./image_modal.controller'); module.exports = { template: template,bindings: { close: '&',resolve: ‘<‘ },controller: ImageModalController };
调用模型的组件控制器
ParentController.$inject = ['$uibModal']; function ParentController $uibModal){ var $ctrl = this; $ctrl.openComponentModal = function (urlFromClickEvent) { var modalInstance = $uibModal.open({ animation: false,resolve: { url: function() { return url; } } }); }; }
作为模态的组件的控制器
ImageModalController.$inject = []; function ImageModalController() { var $ctrl = this; $ctrl.$onInit = function () { console.log($ctrl.resolve.url); }; }