angularjs $state.go 不重定向

Question

我现在真的很沮丧。我尝试在我的 ionic 应用程序中更改状态超过 5 个小时。

这是我的。

$stateProvider
        .state('tab', {
            url: '/tab',
            abstract: true,
            templateUrl: 'templates/tabs.html'
        })
        .state('tab.issues', {
            url: '/issues',
            views: {
                'tab-issues': {
                    templateUrl: 'templates/tab-issues.html',
                    controller: 'IssuesController'
                }
            }
        })
        .state('tab.issue-detail', {
            url: '/issues/:vertragsNr',
            views: {
                'tab-issues': {
                    templateUrl: 'templates/issue-details.html',
                    controller: 'IssueDetailsController'
                }
            }
        })
        .state('tab.issue-steps', {
            url: '/issues/:vertragsNr/steps',
            views: {
                'tab-issues': {
                    templateUrl: 'templates/issue-steps.html',
                    controller: 'IssueStepsController'
                }
            }
        })

当我打开 url http://localhost:8100/#/tab/issues/1/steps在浏览器中手动操作，一切正常， Controller 已加载，一切都按预期工作。

但是当我这样做的时候

$scope.goto = function(){
      $state.go('tab.issue-steps','{vertragsNr:1}') 
    }

在 IssueDetailsController 中，我看到一个转换，IssueStepsController 被加载，但 View 没有改变。

我也试过做一个

ui-sref="tab.issue-steps({ vertragsNr: r.vertragsNr})"

但是当我点击按钮时什么也没有发生。我在页面的源代码中看到在元素上创建了一个 href="#/tab/issues/1/steps"但它不会更改 View 。

我也试过

.state('tab.issue-steps', {
            url: '/steps',
            views: {
                'tab-issues': {
                    templateUrl: 'templates/issue-steps.html',
                    controller: 'IssueStepsController'
                }
            }
        })

但它仍然没有重定向。

我也试过:

$location.url("tab/issues/1/steps");

这也不起作用

我不明白为什么只需更改一个简单的 View 就必须如此复杂!

我不希望在详细信息 View 中有任何 subview 。我只想打开步骤 View 。

好吧，澄清一下，我需要将步骤 View 加载到选项卡问题 View 中，这是我的选项卡控件的内容，这在 subview 中不起作用。

我对这个问题进行了调查:http://plnkr.co/edit/YK7Fp3vUhEPGZeYtOF9Y?p=info 奇怪的是在第二次点击时一切都在 plunker 上工作。但代码与我的应用程序中的代码完全相同。

Answer 1

我注意到那个 plunker 你仍然在引用旧版本的框架:

<script src="http://code.ionicframework.com/1.0.0-beta.5/js/ionic.bundle.min.js"></script>

我会将其更改为最新的稳定版本:

<link href="http://code.ionicframework.com/1.1.0/css/ionic.min.css" rel="stylesheet">
<script src="http://code.ionicframework.com/1.1.0/js/ionic.bundle.min.js"></script>

然后您必须修复 View issue-details.html。你在那个 html View 中有这样的东西:

<div class="list card" ui-sref="tab.issue-detail({ vertragsNr: r.vertragsNr})">
    ....
</div>

你真的不需要

ui-sref="tab.issue-detail({ vertragsNr: r.vertragsNr})"

因为它基本上是在重定向时将页面推回。

只需将其删除，您的 View 将如下所示:

<ion-view view-title="Ausgaben">
<ion-content class="padding">
<div class="list card">
    <div class="item item-divider">{{r.title}}</div>
    <div class="item item-body">
        <div>
            <div><b>Vertragsbeginn:</b> {{r.rentalBegin}}</div>
            <div><b>Objekt:</b> {{r.objekt}}</div>
            <div><b>Abholer:</b> {{r.abholer}}</div>
            <div class="list">
                <button class="item item-icon-left" ng-click="goto()" ng-repeat="m in r.machines" ng-disabled="m.abgabeDatum!==null">
                <i class="icon balanced" ng-class="{'ion-checkmark': m.abgabeDatum!==null}"></i>
                {{m.title}}
                </button>
            </div>
        </div>
    </div>
</div>
</ion-content>
</ion-view>

一切都应该像expected一样工作.

PS:我已经删除了 View issue-steps.html 中的 hide-nav-bar="true" 指令，以确保导航正常工作.即使您将其添加回去，它仍然可以正常工作。

PPS:您可能已经注意到，应用程序的外观与框架的新版本 1.1.0 存在一些差异。
自测试版以来，一些事情发生了变化。