Question

我希望有人可以了解delio在这里的内容。

我有一个简单的$ modal弹出窗口，角度使用ui-router - 当用户点击按钮并在进行api调用后显示信息。它看起来像这样。

.state('rates.rate.runexperiment', {
    url: "/runexperiment",
    onEnter: ['$stateParams', '$state', '$modal', '$timeout', 'ExpsService', function($stateParams, $state, $modal, $timeout, ExpsService){
        var modalInst = $modal.open({
            templateUrl: "templates/ExpsResults.html",
            windowClass: "full",
            controller: ['$scope', '$state', '$timeout',  function($scope, $state, $timeout) {

                $timeout(function(){
                    $("#modal").resizable();
                },0);


                $scope.expResults = null;

                $scope.getExpResults = function(){
                     ExpsService.getExpResults('1000').then(function(response){
                        $scope.expResults = response;
                    });
                };

                $scope.close = function() {
                    $scope.$close(true);
                    $state.go('rates.rate');
                };

                $scope.getExpResults()
            }]
        });


        modalInst.result.then(function(){

        }, function(){
            $state.go('rates.rate');
        });
    }]
})

我在那里有一个jquery函数，你可以看到。我有可调整大小（鼠标，小部件和核心）的所有jquery依赖项，以便工作。

$timeout(function(){
    $("#modal").resizable();
},0);

我的html模板如下：

<div class="modal-header" id="modal">
    <h3>
        Exp Results 
        <span class="pull-right"> 
            {{expResults.name}}
        </span>
    </h3>
    <ul ng-repeat=data in expResults>
        <li>{{data}}</li>
    </ul>
</div>

现在它对$ modal很奇怪，因为它在你的模板html周围创建了两个div包装：一个带有.modal-content类的div和一个模态对话框以及一些淡入淡出的东西。我尝试用jquery选择所有这些，但没有任何反应。

我也试过在我的css中使用resize：但是所有的子元素都继承了resize选择器，每个li元素都会得到一个resize以及其他所有内容。另外，当我选择.modal-content类时，可调整大小仅在溢出时有效：在.modal-content

上设置了scroll

有人可以解释如何让$ modal对话框可调整大小？

css resize / jquery可调整大小为$ modal angular

0 个答案: