AngularJS应用程序的奇怪路由错误

[英]Strange Routing error with AngularJS app


I'm having difficulties implementing a simple routing configuration on my AngularJS application.

在我的AngularJS应用程序上实现简单的路由配置有困难。

This is my HTML file:

这是我的HTML文件:

<html data-ng-app="sportsStore">
    <head>
        <title>Sports Store</title>
        <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" type="text/css" />
        <script src="http://code.jquery.com/jquery-2.1.1.min.js" type="application/javascript"></script>
        <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js" type="application/javascript"></script>
        <script src="https://code.angularjs.org/1.3.0/angular.min.js" type="application/javascript"></script>
        <script src="https://code.angularjs.org/1.3.0/angular-route.min.js" type="application/javascript"></script>
        <script type="application/javascript">
            angular.module('sportsStore', ['customFilters', 'cart', 'ngRoute'])
            .config(function ($routeProvider) {
                $routeProvider.when('/checkout', {
                    templateUrl: '/views/checkoutSummary.html'
                });
                $routeProvider.when('/products', {
                    templateUrl: '/views/productList.html'
                });
                $routeProvider.otherwise({
                    templateUrl: '/views/productList.html'
                });
            });
        </script>
        <script src="controllers/sportsStore.js" type="application/javascript"></script>
        <script src="controllers/productListControllers.js" type="application/javascript"></script>
        <script src="components/cart/cart.js" type="application/javascript"></script>
        <script src="filters/customFilters.js" type="application/javascript"></script>
    </head>
    <body data-ng-controller="sportsStoreCtrl">
        <div class="navbar navbar-inverse">
            <a class="navbar-brand" href="#">SPORTS STORE</a>
            <cart-summary/>
        </div>
        <div class="alert alert-danger" data-ng-show="data.error">
            Error ({{data.error.status}}). The product data was not loaded.
            <a href="/index.html" class="alert-link">Click here to try again</a>
        </div>
        <ng-view />
    </body>
</html>

If i remove all the routing configurations from the route provider, no error is thrown, but as soon as I add them back, this error appears on the browser's console:

如果我从路由提供程序中删除所有路由配置,不会抛出错误,但是一旦我将它们添加回来,这个错误就会出现在浏览器的控制台:

Error: [$compile:tpload] http://errors.angularjs.org/1.3.0/$compile/tpload?p0=%2Fviews%2FproductList.html
y/<@https://code.angularjs.org/1.3.0/angular.min.js:6:409
g@https://code.angularjs.org/1.3.0/angular.min.js:133:480
f/<@https://code.angularjs.org/1.3.0/angular.min.js:109:261
Ke/this.$get</h.prototype.$eval@https://code.angularjs.org/1.3.0/angular.min.js:123:128
Ke/this.$get</h.prototype.$digest@https://code.angularjs.org/1.3.0/angular.min.js:120:212
Ke/this.$get</h.prototype.$apply@https://code.angularjs.org/1.3.0/angular.min.js:123:404
rc/d/<@https://code.angularjs.org/1.3.0/angular.min.js:18:99
e@https://code.angularjs.org/1.3.0/angular.min.js:36:447
rc/d@https://code.angularjs.org/1.3.0/angular.min.js:18:81
rc@https://code.angularjs.org/1.3.0/angular.min.js:18:309
Ed@https://code.angularjs.org/1.3.0/angular.min.js:17:137
@https://code.angularjs.org/1.3.0/angular.min.js:246:98
n.Callbacks/j@http://code.jquery.com/jquery-2.1.1.min.js:2:26852
n.Callbacks/k.fireWith@http://code.jquery.com/jquery-2.1.1.min.js:2:27661
.ready@http://code.jquery.com/jquery-2.1.1.min.js:2:29482
I@http://code.jquery.com/jquery-2.1.1.min.js:2:29656

https://code.angularjs.org/1.3.0/angular.min.js
Line 101

Another error also appears:

另一个错误也出现:

[object XrayWrapper [object DOMException]]
https://code.angularjs.org/1.3.0/angular.min.js
Line 101

But when click on it to get more information, a message blocks me:

但当点击它获取更多信息时,一条消息阻止了我:

NS_ERROR_DOM_BAD_URI: Access to restricted URI denied

2 个解决方案

#1


2  

You need to remove the beginning "/". It works just perfect while you simulate on the PC browser and works fine on iOS as well but fails only in case of Android.

您需要删除开头“/”。当你在PC浏览器上进行模拟时,它就能完美地工作,在iOS上也能正常工作,但只有在Android上才会失败。

Secondly, make sure that the file name and path is correct.

其次,确保文件名和路径是正确的。

#2


0  

It is not able to find the file "/views/checkoutSummary.html". Make sure that the path is correct.

它无法找到“/views/checkoutSummary.html”文件。确保路径正确。

智能推荐

注意!

本站翻译的文章,版权归属于本站,未经许可禁止转摘,转摘请注明本文地址:http://www.itdaan.com/blog/2014/10/29/7dee421b2b8c0a2b543011cf8c47e293.html



 
© 2014-2019 ITdaan.com 粤ICP备14056181号  

赞助商广告