AngularJs使用$状态与ui路由器的解决方案

Question

嗨即时通讯试图让一个示例应用程序启动和运行，我无法得到它加载视图..这里是完整的app.js但我认为错误是在解决对象...任何帮助或指导，将apprieciated ...感谢寻找

这里是GitHub的链接，该项目.... 我会改变API密钥这个问题解决后

https://github.com/ChrisG000/stamplayEbayClassified

angular.module('starter', ['ionic', 'starter.controllers','starter.services', 'starter.templatesComponent', 'ngCordova']) 
.run(function($ionicPlatform, $cordovaStatusbar) { 
    $ionicPlatform.ready(function() { 
// Hide the accessory bar by default (remove this to show the accessory bar above the keyboard 
// for form inputs) 

if(window.cordova && window.cordova.plugins.Keyboard) { 
    cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true); 
} 
if(window.StatusBar) { 
    // org.apache.cordova.statusbar required 
    $cordovaStatusbar.styleColor('white'); 
    //StatusBar.styleDefault(); 
} 
}); 
}) 
.constant('APPID', '') 
.constant('APIKEY','') 
.constant('BASEURL', '') 
.config(function($stateProvider, $urlRouterProvider) { 

$stateProvider 
// setup an abstract state for the tabs directive 
.state('tab', { 
    abstract: true, 
    templateUrl: "templates/tabs.html", 
    resolve: { 
    category: function (Category) { 
     return Category.getPromise(); 
    }, 
    areas : function(Area){ 
     return Area.getPromise(); 
    }, 
    items : function(Item){ 
     return Item.getPromise(); 
    } 
    }, 
}) 

// Each tab has its own nav history stack: 

.state('tab.item', { 
    url: '/item', 
    views: { 
    'tab-item': { 
     templateUrl: 'templates/tab-item.html', 
     controller: 'FindCtrl' 
    } 
    }, 
}) 

.state('tab.item-view', { 
    url: '/item/:itemId', 
    views: { 
    'tab-item': { 
     templateUrl: 'templates/item-view.html', 
     controller: 'ItemCtrl' 
    } 
    } 
}) 
.state('tab.publish', { 
    url: '/publish', 
    views: { 
    'tab-publish': { 
     templateUrl: 'templates/tab-publish.html', 
     controller: 'PublishCtrl' 
    } 
    } 
}) 

.state('tab.account', { 
    url: '/account', 
    views: { 
    'tab-account': { 
     templateUrl: 'templates/tab-account.html', 
     controller: 'AccountCtrl' 
    } 
    } 
}) 

.state('tab.settings', { 
    url: '/settings', 
    views: { 
    'tab-settings': { 
     templateUrl: 'templates/tab-settings.html', 
     controller: 'SettingsCtrl' 
    } 
    } 
}) 

.state('tab.login', { 
    url: '/settings/login', 
    views: { 
    'tab-settings': { 
     templateUrl: 'templates/login-view.html', 
     controller: 'LoginCtrl' 
    } 
    } 
}) 

.state('tab.signup', { 
    url: '/settings/signup', 
    views: { 
    'tab-settings': { 
     templateUrl: 'templates/signup-view.html', 
     controller: 'LoginCtrl' 
    } 
    } 
}) 

.state('tab.contact', { 
    url: '/settings/contact', 
    views: { 
    'tab-settings': { 
     templateUrl: 'templates/contact-view.html', 
     controller: 'SettingsCtrl' 
    } 
    } 
}) 

.state('tab.terms', { 
    url: '/settings/terms', 
    views: { 
    'tab-settings': { 
     templateUrl: 'templates/terms-view.html', 
     controller: 'SettingsCtrl' 
    } 
    } 
}) 

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

Answer 1

好的，下面是y你会诊断这样的事情。首先，你想避免循环，因为这很难弄清楚发生了什么。由于问题出现在您的默认路由上，因此解决方案是暂时将您的默认路由更改为其他路由。然后，您将手动转到localhost：8100 /＃/ item。在这种情况下，您将避免循环，您将能够查看Chrome DevTools，以查看发生了什么，而不会出现阻止DevTools的无限循环。

首先，改变你的app.js文件，以包括以下简单的路线：

.state('testing', { 
    url: '/testing', 
    template: '<h1>Testing</h1>' 
}) 

而且在app.js（线143），更改默认路由去我们的简单路线：

$urlRouterProvider.otherwise('/testing'); 

现在，在您的浏览器中，在DevTools打开时直接访问http://localhost:8100/#/item。在实际点击回车之前，请确保将网络和控制台标签配置为“保留日志”（这是一个复选框）。这样，即使您被重定向到/测试，因为出现错误，您实际上也能够在DevTools控制台中看到错误。

就你而言，错误是发送到http://localfood.stamplay.com/api/cobject/v0/category的OPTIONS请求上的404错误。您可以在CORS和离子这里读了起来：http://blog.ionic.io/handling-cors-issues-in-ionic/

此外，当我试图访问http://localfood.stamplay.com/api/cobject/v0/category直接我招呼了太多的在我的浏览器，这意味着自己是不是API服务器上正确配置重定向错误。服务器应该在/ error中响应某种错误，但是它会保持重定向到它自己。

底线，它看起来像一个服务器配置问题。

编辑：当使用更新的URL http://localfood.stamplayapp.com/api/cobject/v0/category我得到一个403禁止，所以我的猜测是，OP发布此之后改变了API密钥，但是，这并解决他的问题。