（离子）问题：$ state.go不显示模板

我有这个代码块的问题，当我点击按钮时，什么都没有发生...... 通常，模板里面的“news.html “应该显示。我已经在互联网上查过，但没有任何帮助我......那么请问哪里出了问题？

“app.js”

var nameApp = angular.module('starter', ['ionic']); 

nameApp.config(['$stateProvider', '$urlRouterProvider', '$ionicConfigProvider', function ($stateProvider, $urlRouterProvider, $ionicConfigProvider) { 
$stateProvider 
    .state('tab', { 
    url: '/tab', 
    abstract: true, 
    templateUrl: 'tabs.html' 
    }) 

    .state('tab.home', { 
    url: '/home', 
    views: { 
     'home': { 
     templateUrl: 'home.html', 
     controller: 'HomeCtrl' 
     } 
    } 
    }) 

    .state('tab.news', { 
    url: '/news', 
    views: { 
     'News': { 
     templateUrl: 'news.html', 
     controller: 'HomeCtrl' 
     } 
    } 
    }) 

$urlRouterProvider.otherwise('/tab/home'); 

}]); 

nameApp.controller('HomeCtrl', ['$scope', '$state', function ($scope, $state) { 

    $scope.goNews = function() { 
    $state.go("tab.news"); 
    }; 

}]);

“的index.html”

<html ng-app="starter"> 

<head> 
    <meta charset="utf-8" /> 
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width" /> 
    <title>Ionic Framework Example</title> 
    <link href="//code.ionicframework.com/nightly/css/ionic.css" rel="stylesheet"/> 
    <link href="style.css" rel="stylesheet"/> 
    <script src="//code.ionicframework.com/nightly/js/ionic.bundle.js"></script> 
    <script src="app.js"></script> 
</head> 

<body> 
    <ion-nav-bar class="bar-stable"> 
    <ion-nav-back-button> 
    </ion-nav-back-button> 
    </ion-nav-bar> 

    <ion-nav-view> 

    </ion-nav-view> 
</body> 

</html>

“tabs.html”

<ion-tabs class="tabs-icon-top tabs-color-active-positive"> 

    <!-- Home Tab --> 
    <ion-tab title="Home" icon-off="ion-ios-home-outline" icon-on="ion-ios-home" href="#/tab/home"> 
    <ion-nav-view name="home"></ion-nav-view> 
    </ion-tab> 

    <!-- Login Tab --> 
    <ion-tab title="Login" icon-off="ion-ios-locked-outline" icon-on="ion-ios-locked" href="#/tab/login"> 
    <ion-nav-view name="login"></ion-nav-view> 
    </ion-tab> 

</ion-tabs>

“/home.html” 的

<ion-view title="Home"> 
    <ion-content class="padding"> 
    <button type="submit" class="button button-block button-positive" ng-click="goNews()"> News </button> 
    </ion-content> 
</ion-view>

“news.html”

<ion-view title="News"> 
    <ion-content class="padding"> 

    <div class="padding"> 
     <h1> News </h1> 
    </div> 

    </ion-content> 
</ion-view>

来源

2017-04-18 Totof TonMomon

问题是您的视图的名称。

.state('tab.news', { 
    url: '/news', 
    views: { 
     'News': { //<= this is the name of the ui-view in which this state loads. 
     templateUrl: 'news.html', 
     controller: 'HomeCtrl' 
     } 
    } 
    })

你的标签有两种观点：

<!-- Home Tab --> 
    <ion-nav-view name="home"></ion-nav-view> 

    <!-- Login Tab --> 
    <ion-nav-view name="login"></ion-nav-view>

“家” 和 “登录”。您正尝试在“新闻”中加载您的视图，该视图不存在。如果您更改“新闻”=>“家庭”，它将起作用。

来源

2017-04-18 17:31:18 yBrodsky

（离子）问题：$ state.go不显示模板

回答

相关问题