Question

再次向大家求助于AngularJS。我正在构建一个SPA，其中我的布局（主）页面被划分为三个部分左侧导航栏，中心内容，右侧项目列表栏。我加载主页时应隐藏正确的项目列表，但应在剩余的屏幕中显示。我在homeController中创建了一个$ rootScope变量，并根据位置路径将值设置为'true'，并在模板中使用该变量将值设置为ngHide。当我使用SPA导航到另一个页面时，我的右侧和左侧栏不会再次加载，只有我的中心内容会执行新视图。在将数据发送到新视图模板的控制器中加载新视图时，我将我在homeController中创建的$ rootScope变量重置为'false'，但我的右边栏仍然不可见。虽然interpollation已将值更新为'true'，但我可以看到ng-hidden类仍然存在。任何建议都将受到高度赞赏。

布局页面中的

标记：

<aside class="right_bar" ng-hide="{{$root.show}}">
        <div class="my-list"><span class="f3">My Cart</span><div class=""><span class="list-count">0</span></div></div><div class="list-item"><ul></ul></div>
    </aside>

homeController代码：

    function getHomeConfigsCtrl($http, $location, $rootScope) {

     $rootScope.show = false;

    var loc = $location.path();

    if (loc === '/Home/Index' || loc ==='')
    {
        $rootScope.show = true;
    }
   }

类别控制器代码：这是我重置$ rootScope变量值

的地方

function getAllCategoryDetails($routeParams,$rootScope) {
    $rootScope.show = false;
}

Answer 1

有关角度的两件事，你需要知道才能使你呈现的代码有效：

您无需在ng指令中使用{{}}插值，而是使用ng-hide="showCart"。
假设您的所有控制器都在同一个角度应用程序中，同一个应用程序中的所有作用域都从同一个根继承，即你在$ rootScope上定义的内容对所有人都可用儿童范围。要从应用程序的任何视图中访问$ rootScope.x，您只需：{{x}}或者您在指令中使用它可以执行以下操作：

<aside class="right_bar" ng-hide="showCart">

这将查找您当前的范围，如果它有showCart然后它将使用它，否则它将获取$ rootScope.showCart

在单页应用程序中使用$ rootScope的ngHide / ngShow

1 个答案: