Javascript 角度UI路由器-与子级和父级解析

我有一个有角度的页面，根据页面对象中的一个值是否等于某个特定值，我可能会加载另一个状态，我说可能，因为如果不是，那么我就不需要加载另一个视图（但这可能就是出错的地方？）

这是我当前的状态配置

$stateProvider
    .state('app', {
        url: '',
        abstract: true,
        templateProvider: ['$templateCache', function ($templateCache) {
            return $templateCache.get('app/main/main.html');
        }],
        controller: 'MainController',
        resolve: {
            Pages: ['PageApi', function (PageApi) {
                return PageApi.getAll();
            }]
        }

    })
    .state('app.page', {
        url: '/page/{id}',
        params: {
            id: { value: 0 }
        },
        templateProvider: ['$templateCache', function ($templateCache) {
            return $templateCache.get('app/page/page.html');
        }],
        controller: 'PageController',
        resolve: {
            Page: ['$stateParams', 'PageApi', function ($stateParams, PageApi) {
                return PageApi.get($stateParams.id);
            }],
            Contents: ['$stateParams', 'ContentApi', function($stateParams, ContentApi) {
                return ContentApi.getByPage($stateParams.id);
            }]
        }
    })
    .state('app.page.search', {
        templateProvider: ['$templateCache', function ($templateCache) {
            return $templateCache.get('app/page/partials/page-search.tpl.html');
        }],
        controller: 'PageSearchController',
        resolve: {
            Module: ['ModuleApi', 'Page', function(ModuleApi, Page) {
                return ModuleApi.get(Page.moduleId);
            }]
        }
    })

正如你们所看到的，我的基本状态是app，它加载我的基本页面（一切正常）

我还有app.page，它将加载我的partial page.html（同样很好）

app.page使用此控制器和此部分html文件

angular.module('app').controller('PageController', ['$state', '$scope', 'Page', 'Contents', 
    function ($state, $scope, Page, Contents) {

        if (Page.action == 'search')
            $state.go('app.page.search');
    }]);

app/page/page.html

<!-- main -->
<section role="main" class="row">
    <div ui-view></div>

    <div ng-if="showSide" class="col-md-3">
        <div page-location location="side"></div>
    </div>
</section>

app/main/main.html

<div class="container">
    <div class="wrapper">
        <!-- content -->
        <div ui-view class="content"></div>
    </div>
</div>

现在我认为子状态的解析与它们的父状态相同，但是当app.page.search解析执行时，它会抛出一个错误，说页面未定义

如何从app.Page.search访问app.Page解析

我显然设置了错误的东西，但不确定是什么

---

正如我之前所说，应用程序应该加载我的基本页面（确实如此），app.page应该加载我的页面内容，app.page.search应该根据应用程序中加载的页面对象加载更多内容。页面解析。也许我不应该改变页面控制器的状态？但我不知道您是否可以在另一个状态配置中更改状态？

我实际上非常确定您不想要的不是嵌套视图。无论如何，这里有两个解决方案：

第一个：

实际上，您可以在PageController中定义变量的范围

$scope.Page = Page;

在PageSearchController中，您可以通过以下方式访问它：

$scope.Page;

您必须了解angularJS$scope的机制

如果您从$scope请求var。如果此变量存在，它将在当前范围内搜索。如果没有，它将在父范围（这里是您的父状态控制器）中搜索var是否存在。如果它到达rootScope并且没有找到您的var，它将触发一个异常

第二种解决方案：

根据某些信息，您可能希望加载HTML的一部分。然后，不要使用状态，只使用带有ng if条件的ng include

<ng-include ng-if="Page.action == 'search'" ng-controller="PageSearchController" src="app/page/partials/page-search.tpl.html"></ng-include>

如果这确实是一个嵌套视图，请选择第一个。如果这只是您视图的一部分，请选择第二个

---

希望它能帮助您解决您的问题。

如果使用nginclude，是否仍有停止第二次加载的方法，直到一些承诺像美国一样得到解决？事实上没有。据我所知，我不知道如何使用ng include解决问题。也许第一个是你的用例。