Question

这是我的文件夹结构：

public
--js
----controllers
------aController.js
------bController.js
----app.js
----router.js
--styles
----a.css
----b.css
--html
----a.html
----b.html
--index.html

在我的index.html文件中，我有：

<body ng-app="myApp">
    <div ng-view></div>
</body>

在我的router.js文件中，我有：

myApp.config(['$routeProvider',function($routeProvider) {
    $routeProvider
    .when('/a', {
        controller: 'aController',
        templateURL: 'html/a.html',
        css: 'styles/a.css'
    })
    .when('/b', {
        controller: 'bController',
        templateUrl: 'html/b.html',
        css: 'styles/b.css'
    })
    .otherwise({
        redirectTo: '/a'
    });
}]);

在a.html和b.html中我只有一个带有里面字母的div。即：

<p>a</p>

因此，当我加载页面时，我希望看到“a”，但我看到的只是空白区域。当我检查元素时，它显示。我测试了我的路由，它似乎导航到正确的地址，但为什么我的模板不显示/为什么我的ng-view被注释掉了？我尝试从localhost运行并在Web浏览器中打开它以达到同样的效果。

编辑：如果重要的话，我没有收到任何控制台错误，我在启动时看到的路径是：

... / appFolder /公共/ index.html中＃/ A

Answer 1

myApp.config(['$routeProvider',function($routeProvider) {
    $routeProvider
    .when('/a', {
        controller: 'aController',
        templateURL: '/html/a.html',
        css: '/styles/a.css'
    })
    .when('/b', {
        controller: 'bController',
        templateUrl: '/html/b.html',
        css: '/styles/b.css'
    })
    .otherwise({
        redirectTo: '/a'
    });
}]);

您的router.js文件似乎位于js文件夹中，因此路径中的路径无效。请检查上面代码段中的路径。

Answer 2

所以...我的路径很好。但是，我将templateURl中的“R”大写... routeprovider对象上也没有css属性。愚蠢的错别字...感谢大家的帮助！

AngularJS $ routeProvider模板未显示在ng-view中

2 个答案: