Question

我有一个带有ui路由器的角应用程序，带有嵌套视图（在config方法中）：

$stateProvider
.state('home', {
    url: '/home',
    views: {
        'mainView' : {
            templateUrl: 'templates/home.html',
            controller: 'HomeController'
        }
    },
    authenticate: true
})
.state('home.cargaDePadrones', {
    url: '/cargaDePadrones',
    views: {
        'contentView' : {
            templateUrl: 'templates/cargaDePadrones.html',
            controller: 'CargaDePadronesController'
        }
    },
    authenticate: true
})

在主视图中，我有这个：

<md-content layout="row" layout-fill>
    <md-content ng-show="showTreeMenu" class="TextoInstitucional menuCell" flex="20">
        <treecontrol class="tree-classic" tree-model="treeData" options="treeOptions"
            on-selection="showSelected(node)" expanded-nodes="expandedNodes">
            {{node.name}}
        </treecontrol>
    </md-content>
    <div style="background-color: #CECECE; width: 9px;" layout="column" layout-align="center center">
        <a flex href="#" ng-show="showTreeMenu" ng-click="toggleMenu()">
            <img style="border: 0 none;" src="images/middle_toggle_left.gif" />
        </a>
        <a flex href="#" ng-show="!showTreeMenu" ng-click="$parent.toggleMenu()">
            <img style="border: 0 none;" src="images/middle_toggle_right.gif" />
        </a>
    </div>
    <md-content class="TextoGrande contentCell" style="padding-left: 10px;" ui-view="contentView" ng-cloak flex>
    </md-content>
</md-content>

在家庭控制器中我得到了这个：

$scope.showTreeMenu = true;

$scope.toggleMenu = function() {
    $scope.showTreeMenu = !$scope.showTreeMenu;
};

这个想法是，每当用户点击锚点时，页面的一部分会隐藏（菜单）以给它提供更多的工作空间，当它击中另一个锚点时它会带回菜单。

问题在于，每当我点击在主视图中可见的锚点（执行toggleMenu范围方法）时，嵌套视图中的内容（名为“contentView”）就会消失。查看浏览器路径，它会自动从/ home / cargaDeParones路由到/ home（从子状态到父状态的路由）。我假设发生了这种情况，因为toggleMenu方法是在Home控制器中定义的，但我不知道如何防止这种行为。

如何在不路由回来的情况下公开父级的范围方法？

谢谢：）

Answer 1

锚点标签href值是＆＃39;＃＆＃39; ，这就是它进入主页的原因。请将锚标记href标记更改为：

<a flex href="JavaScript:void(0)" ng-show="showTreeMenu" ng-click="toggleMenu()">
        <img style="border: 0 none;" src="images/middle_toggle_left.gif" />
</a>

ui-router自动路由到父控制器

1 个答案: