AngularJS ng-if和ng-class切换。将内联代码转换为ng-click功能

Question

我正在使用ng-include拉入一个带下拉菜单的Bootstrap按钮。当我编写内联ng-if时，切换不起作用。我知道我需要使用ng-click。我的问题是如何将内联ng-if转换为函数。

我转换了这个：

<a href="" ng-click="isPreviewPanelOpen = !isPreviewPanelOpen">Image preview on/off</a>

到

<li> <a href="" ng-click="previewPanel()">Image preview on/off</a></li>

我写的功能很差，而且不起作用。

$scope.previewPanel = function() {

      isPreviewPanelOpen = !isPreviewPanelOpen;

    };

这是它控制的部分（显示/隐藏）。如果我不使用和ng-include

，它就有效

<div class="leftblock" ng-class="{'col-xs-12': isPreviewPanelOpen, 'col-xs-8': !isPreviewPanelOpen}">

Answer 1

您需要在函数中修改视图的范围（通过$scope）。

$scope.previewPanel = function() {
  $scope.isPreviewPanelOpen = !$scope.isPreviewPanelOpen;
};

您当前的功能正在改变某个随机变量的值（可能是全局的）。