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

时间:2014-09-04 15:15:59

标签: javascript angularjs angular-ui-router

我有一个基本的搜索结果页面。这是我的ui-router配置:

    $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,以便恢复范围,从而重新填充&#34;表格。我想知道是否有更好的解决方案。

谢谢。

1 个答案:

答案 0 :(得分:0)

我看到你当时并不了解服务。只需使用服务!您的模型将保留为可以从您引用它的任何位置绑定的单例。这样你就不必担心ui-router是否会生成1或3个控制器实例。