Question

请帮我解决以下问题。

我的HTML：

<div id="button1" ng-hide="videopagepanel.indexOf('l') >= 0" class="col-md-1">
    <a ng-click="videopagepanel = videopagepanel + 'l';" ></a>
</div>

<div id="button2" ng-show="videopagepanel.indexOf('l') >= 0" class="col-md-3">        
    <a ng-click="videopagepanel = videopagepanel.indexOf('l') >= 0?videopagepanel.replace('l', ''):'l' + videopagepanel"></a>
</div>


<div id="page-content" ng-class="'col-md-' + (colnrpagecont - videopagepanel.length)">
    Some content
</div>

我的jQuery：

$(window).resize(function ($window) {

    if ($window.innerWidth < 992) {
        $scope.videopagepanel = 'lr';
    }  

    else if ($window.innerWidth < 1200) { 
        $scope.videopagepanel = $scope.videopagepanel.replace('r', '');
        $scope.colnrpagecont =$scope.videopagepanel.length===1?10:11;

    } 

});

如果我将窗口调整大小例如1100px，则初始状态是＃button2显示col-md-3而#page-content div的列大小为col-md-9 。如果我从这个州点击＃button2，它就会消失，＃button1会显示col-md-1。问题是#page-content列不会调整为col-md-11。

出了什么问题？似乎angular不会将更新推送到jQuery条件或范围。

非常感谢你的帮助，因为我一直在努力解决这个问题！

Answer 1

使用window或$(window)代替$window（我认为未定义）。

另外，对于性能问题，最好是

$scope.videopagepanel = "l";

而不是

$scope.videopagepanel = $scope.videopagepanel.replace('r', '');

如何根据窗口（重新）大小和数组长度更改ng-class

1 个答案: