栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 面试经验 > 面试问答

Angular uibModal,解析,未知提供程序

面试问答 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

Angular uibModal,解析,未知提供程序

您有两个问题:

  1. 您需要在模态配置中定义控制器
  2. 你的决心对象需要是地图的
    string
    function
    ,其中
    string
    是将被注入到你的模态的控制依赖的名称,
    function
    是将用来提供这种依赖性当控制器被实例化一个工厂函数。

工作示例:JSFiddle

Javascript

angular.module('myApp', ['ui.bootstrap'])  .controller('MyModalController', MyModalController)  .directive('modalTrigger', modalTriggerDirective)  .factory('$myModal', myModalFactory);function MyModalController($uibModalInstance, items) {  var vm = this;  vm.content = items;  vm.confirm = $uibModalInstance.close;  vm.cancel = $uibModalInstance.dismiss;};function modalTriggerDirective($myModal) {  function postlink(scope, iElement, iAttrs) {    function onClick() {      var size = scope.$eval(iAttrs.size) || 'lg'; // default to large size      var title = scope.$eval(iAttrs.title) || 'Default Title';      var message = scope.$eval(iAttrs.message) || 'Default Message';      $myModal.open(size, title, message);    }    iElement.on('click', onClick);    scope.$on('$destroy', function() {      iElement.off('click', onClick);    });  }  return {    link: postlink  };}function myModalFactory($uibModal) {  var open = function (size, title, message) {    return $uibModal.open({      controller: 'MyModalController',      controllerAs: 'vm',      templateUrl : 'templates/CustomModal.html',      size: size,      resolve: {        items: function() {          return { title: title, message: message          };        }      }    });  };  return {    open: open  };}

HTML

<script type="text/ng-template" id="templates/CustomModal.html">  <div >    <h3 >{{vm.content.title}}</h3>  </div>  <div >    {{vm.content.message}}  </div>  <div >    <button  type="button" ng-click="vm.confirm()">      confirm    </button>    <button  type="button" ng-click="vm.cancel()">      cancel    </button>  </div></script><button modal-trigger size="'sm'" title="'Hello World!'" message="'This is a test'">  Click Me</button>


转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/448273.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号