模板之间的路由不适用于 Angular UI

Question

这是我的 router.js

angular.module('app.routes', []).config(function($stateProvider, $urlRouterProvider) {

$stateProvider.state('tabsController.dashboard', {
    url : '/page2',
    views : {
        'tab1' : {
            templateUrl : 'templates/dashboard.html',
            controller : 'dashboardCtrl'
        }
    }
}).state('tabsController.searchResults', {
    url : '/page1/page3',
    views : {
        'tab1' : {
            templateUrl : 'templates/searchResults.html',
            controller : 'searchResultsCtrl'
        }
    }

}).state('tabsController', {
    url : '/page1',
    abstract : true,
    templateUrl : 'templates/tabsController.html'
});

// if none of the above states are matched, use this as the fallback
$urlRouterProvider.otherwise('/page1/page2');

});

这是我的路由模板dashboard.html

<ion-content class="has-header" padding="true">

    <form class="list" name="myform">
        <label class="item item-input" name="Language"> <i class="icon ion-search placeholder-icon"></i>
            <input type="text" placeholder="Language" name="lang" ng-model="dashboardCtrl.localMovies.lang" ng-minlength=1 ng-disabled="myform.movie.$valid" required>
        </label>
        <span> OR </span>
        <label class="item item-input" name="Movie"> <i class="icon ion-search placeholder-icon"></i>
            <input type="text" placeholder="Name of Movie" name="movie" ng-model="dashboardCtrl.localMovies.movie" ng-minlength=1 ng-disabled="myform.lang.$valid" required>
        </label>
    </form>
    <a class="button button-positive button-block " href="#/page1/page3/">Search</a>
</ion-content>

单击搜索按钮时未加载 SearchResult.html 模板。请帮我找出问题

Answer 1

我认为你犯了一个 url 错误。 在这里

state('tabsController.searchResults', {
    url : '/page1/page3',
    views : {
        'tab1' : {
            templateUrl : 'templates/searchResults.html',
            controller : 'searchResultsCtrl'
        }
    }
})

网址应该是这样的：

url : '/page3'

Answer 2

试试这个：

.state('tabsController.searchResults', {
    url : '/page3',
    views : {
        'tab1' : {
            templateUrl : 'templates/searchResults.html',
            controller : 'searchResultsCtrl'
        }
    }

})

子状态会继承父状态的url并添加/page3所以tabsController.searchResults状态的url会变成/page1/page3