zoukankan      html  css  js  c++  java
  • angular js模态框

    <!-- 按钮触发模态框 -->
    <button ng-controller="UserInfoController" class="btn btn-primary btn-lg" data-toggle="modal" ng-click="open()">
    开始演示模态框
    </button>
    <script type="text/ng-template" id="/myModalContent.html">
    <div class="modal-header"><button class="close" type="button" data-dismiss="modal" aria-hidden="true">?/button><h4 class="modal-title" id="myModalLabel">Modal title</h4></div>
    <div class="modal-body">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div>
    <div class="modal-footer"><button class="btn btn-primary" ng-click="ok()">OK</button><button class="btn btn-warning" ng-click="cancel()">Cancel</button></div>
    </script>

    UserInfoController.$inject = ['$scope', '$uibModal'];
    //controller的函数
    function UserInfoController($scope, $uibModal) {
    $scope.open = function () {
    var modalInstance = $uibModal.open({
    templateUrl: '/myModalContent.html',
    controller: function ($scope, $uibModalInstance) {
    $scope.ok = function () {
    $uibModalInstance.close('closed');
    }
    $scope.cancel = function () {
    $uibModalInstance.dismiss('cancel');
    }
    },
    size: 'lg'
    });
    }
    }

  • 相关阅读:
    .Net插件编程模型:MEF和MAF[转载]
    并行任务task
    wpf动画概述
    vs在线工具杂烩
    力挺8天入门wpf【转载】
    vs debug 快捷键
    Visual Studio® 2010 Web Deployment Projects站点编译生成bin同时发表插件
    EasyUI选项卡tab页面处理示例
    显示输入框只能输入的内容
    JqueryeasyUI选项卡选择判定更改内部Iframe地址
  • 原文地址:https://www.cnblogs.com/0280-hnn/p/7406183.html
Copyright © 2011-2022 走看看