通过ui-sref更改路由可以正常工作.
当我在基本URL(example.com/account)上手动刷新页面时,一切都同样有效.
但是,当我手动刷新页面并且url包含hashbang(即http://example.com/account/#/billing时,我在控制台中看到以下错误).
TypeError: Cannot read property 'charAt' of undefined at Object.$$parse (https://ajax.googleapis.com/ajax/libs/angularjs/1.2.25/angular.js:9321:40) at https://ajax.googleapis.com/ajax/libs/angularjs/1.2.25/angular.js:9878:21 at Scope.$get.Scope.$eval (https://ajax.googleapis.com/ajax/libs/angularjs/1.2.25/angular.js:12701:28) at Scope.$get.Scope.$digest (https://ajax.googleapis.com/ajax/libs/angularjs/1.2.25/angular.js:12513:31) at Scope.$get.Scope.$apply (https://ajax.googleapis.com/ajax/libs/angularjs/1.2.25/angular.js:12805:24) at done (https://ajax.googleapis.com/ajax/libs/angularjs/1.2.25/angular.js:8378:45) at completeRequest (https://ajax.googleapis.com/ajax/libs/angularjs/1.2.25/angular.js:8592:7) at XMLHttpRequest.xhr.onreadystatechange (https://ajax.googleapis.com/ajax/libs/angularjs/1.2.25/angular.js:8531:11)
在阅读了这个错误并添加了断点之后,我注意到,在加载时,路径正在从表格中暂时重写
/account/#/billing /account/#settings
其中帐户是应用程序的基础,表单是
/billing/ /settings/
最终,在错误发生后,地址栏中将恢复正确的URL表单.
这些临时(中间)路径似乎导致$$解析中的以下代码中断. AppBase绑定到“example.com/account/”,url绑定到像“mysite.com/billing”这样的值. withoutBaseUrl绑定为undefined,因为url不包含超出appBase的字符.
this.$$parse = function(url) { var withoutBaseUrl = beginsWith(appBase,url) || beginsWith(appBaseNoFile,url); var withoutHashUrl = withoutBaseUrl.charAt(0) == '#' ? beginsWith(hashPrefix,withoutBaseUrl) : (this.$$html5) ? withoutBaseUrl : '';
这是我的相关代码:
plaidApp.config(['$stateProvider','$urlRouterProvider','$interpolateProvider',function($stateProvider,$urlRouterProvider,$interpolateProvider) { $stateProvider .state('account',{ url: '/',controller: 'MainCtrl',templateUrl: 'dashboard_home.html',}); $stateProvider .state('metrics',{ url: '/metrics',controller: 'MetricsCtrl',templateUrl: 'dashboard_metrics.html',resolve: { actions: ['actionModel',function(actionModel) { return actionModel.fetch(); }] } }); $stateProvider .state('billing',{ url: '/billing',controller: 'BillsCtrl',templateUrl: 'dashboard_billing.html',resolve: { bills: ['billingModel',function(billingModel) { return billingModel.fetch(); }] } }); $stateProvider .state('resources',{ url: '/resources',templateUrl: 'dashboard_resources.html',}); $stateProvider .state('settings',{ url: '/settings',controller: 'SettingsCtrl',templateUrl: 'dashboard_settings.html',}); $urlRouterProvider.otherwise('/#'); $interpolateProvider.startSymbol('{[{').endSymbol('}]}');
}]);
解决方法
尝试在定义路由之前编写interpolate语句:
$interpolateProvider.startSymbol('{[{').endSymbol('}]}'); $stateProvider .state('account',{ ...
模板链接和编译可能在执行插入语句之前已经开始,如果您使用了“{[}”,则该模板可能无法解析它.