javascript - ui-router 阻止 transitionTo 重新加载父状态

Question

我有一个基本的搜索结果页面。这是我的用户界面路由器配置:

    $stateProvider
        .state('search', {
            url: '/search',
            templateUrl: 'app/templates/search.html',
            controller: 'searchController'
        })
        .state('search.results', {
            url: '/results/:searchParameters',
            templateUrl: 'app/templates/results.html',
            controller: 'resultController'
        });

这就是我将参数从搜索发送到实际执行 GET 的 search.results 的方式

    $scope.search = function () {
        if (!$state.is('search.results')) {
            $state.go('search.results', { searchParameters: $scope.searchParameters });
        }
        else {
            $state.transitionTo('search.results', { searchParameters: $scope.searchParameters }, { reload: true, inherit: true, notify: true });
        }
    };

这是我的 search.html

<div class="row">
    <form name="parameters" role="form" class="form-search" novalidate>
        <input type="text" class="form-control uppercase" placeholder="Codice manifestazione" 
               ng-enter="search()" ng-model="searchParameters.maniCode" />
        <input type="number" class="form-control" placeholder="Anno" 
               ng-enter="search()" ng-model="searchParameters.year" maxlength="4" required/>
        <br />
        <label>Stato manifestazioni:</label>
        <select ng-enter="search()" ng-model="searchParameters.open" ng-init="searchParameters.open = true">
            <option value="true">Aperte</option>
            <option value="false">Chiuse</option>
        </select>
        <br />
        <br />
        <input type="button" value="Cerca" class="btn btn-default" 
               ng-click="search()" 
               ng-disabled="(parameters.$invalid || parameters.$pristine) || (clicked && !loaded)"/>
        <input type="button" value="Esporta in Excel" class="btn btn-default"
               ng-click="excelMain()"
               ng-disabled="(parameters.$invalid || parameters.$pristine) || (clicked && !loaded)" />
        <br />
        <br />
        <ul class="noStyleUl">
            <li ng-show="searchParameters.year.length < 4">Inserisci un anno per abilitare la ricerca</li>
        </ul>
    </form>
    <div ui-view>

    </div>
</div>

不幸的是，$state.transitionTo 不仅会重新加载 search.results(好)，还会重新加载搜索(坏!)，从而清理我的表单。

我现在所做的是将一个事件从 ResultsController 发送到 SearchController 以恢复作用域，从而“重新填充”表单。我想知道是否有更好的解决方案。

谢谢。

Answer 1

我看到您当时还不了解服务。只需使用服务!您的模型将在您引用它的任何地方保持为可绑定(bind)的单例。这样您就不必担心 ui-router 会生成 1 个或 3 个 Controller 实例。