dialog - meetbill/butterfly-fe GitHub Wiki

对话框

示例

static/tpl/form_elements.html

<span ng-controller="ModalDemoCtrl">
    <script type="text/ng-template" id="myModalContent.html">
        <div ng-include="'static/tpl/modal.form.html'"></div>
    </script>
    <button class="btn btn-success" ng-click="open('lg')">在弹框中显示表单</button>
</span>

static/js/controllers/bootstrap.js

//模式对话框演示代码
app.controller('ModalInstanceCtrl', ['$scope', '$modalInstance', 'items', function ($scope, $modalInstance, items) {
    $scope.items = items;
    $scope.selected = {
        item: $scope.items[0]
    };

    $scope.ok = function () {
        $modalInstance.close($scope.selected.item);
    };

    $scope.cancel = function () {
        $modalInstance.dismiss('cancel');
    };
}])
;
app.controller('ModalDemoCtrl', ['$scope', '$modal', '$log', function ($scope, $modal, $log) {
    $scope.items = ['项目1', '项目2', '项目3'];
    $scope.open = function (size) {
        var modalInstance = $modal.open({
            templateUrl: 'myModalContent.html',
            controller: 'ModalInstanceCtrl',
            size: size,
            resolve: {
                items: function () {
                    return $scope.items;
                }
            }
        });

        modalInstance.result.then(function (selectedItem) {
            $scope.selected = selectedItem;
            $log.info('选择结果: ', selectedItem);
        }, function () {
            $log.info('模式对话框关闭时间: ' + new Date());
        });
    };
}])
;
⚠️ **GitHub.com Fallback** ⚠️