I'm having a problem with Angular templating - instead of including the correct template, the main view (view that initially gets loaded) is renderend twice. After spending the most of the last 2 days trying to solve this, I'm still getting nowhere.

More detailed description:

I'm using Angular to develop a single page application for managing a website's content. The rest of this website is built with Laravel. Angular is used only for the content management system which is a separate application that's protected by Laravel's HTTP filters and authentication system.

The problem occurs when the Angular app is not located at the root URL (for example, works, while doesn't).

The main code (stripped down to essentials in an attempt to find the problem):

/*global angular*/
var App = angular.module('Dashboard', ['ui.router']);

App.config(function ($stateProvider, $urlRouterProvider, $locationProvider) {
    'use strict';

    $stateProvider.state('statistics', {
        url: '/statistics',
        templateUrl: 'statistics/index.html'

    $stateProvider.state('notifications', {
        url: '/notifications',
        templateUrl: 'notifications/index.html'

    $urlRouterProvider.when('/', '/statistics');

The application view:

<!DOCTYPE html>
<html lang="en" ng-app="Dashboard">
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <base href="/admin/">
        <div id="container" class="full">
                        <li><a ui-sref="statistics">Statistics</a></li>
                        <li><a ui-sref="notifications">Notifications</a></li>
            <div id="content" ui-view></div>
        <script src=""></script>
        <script src=""></script>
        <?php echo HTML::script(asset('javascripts/main.js')) ?>

Sample template that doesn't get included for some reason:

<section id="statistics">

Laravel routing file:

        'namespace' => 'Admin',
        'prefix' => 'admin'
    function () {
                'namespace' => 'Account'
            function () {
                        'prefix' => 'login'
                    function () {
                        Route::get('/', [
                            'as' => 'admin.login',
                            'uses' => 'LoginController@showLogin'

                        Route::post('/', [
                            'uses' => 'LoginController@attemptLogin'

                Route::get('logout', [
                    'as' => 'admin.logout',
                    'uses' => 'LogoutController@attemptLogout'

        Route::get('/', [
            'as' => 'admin.dashboard',
            'before' => 'auth',
            'uses' => 'DashboardController@start'

Every time I'm using the templateUrl option (template obviously works since no file is included), it doesn't include the correct template. Instead another request is fired to URL and it essentially duplicates the whole view after receiving the 200 OK status code. I've tried to narrow the problem using Chrome's developer tools - the only unusual thing was that the requests initiator is the template (or URL) that should be included normally. Unfortunately that doesn't help much.

I'm a bit suspicious that the problem might be caused by Laravel's routing or URL rewriting, but I haven't been enable to verify it yet. Any ideas what could be the reason of this behaviour?


Added the routes.php file in case it might be causing this problem.

douiwn6941 没有.htaccess,因为我的虚拟主机的根文件夹是Laravel安装的公共目录。无论如何,我找到了这个问题的解决方案,并将很快发布。
大约 6 年之前 回复
donglu6303 发布你的htaccess:)
大约 6 年之前 回复
doukang8949 如果你有为url并且你的laravel路由中的某些内容出错了,那就无济于事了。但是也可以在不使用html5mode时删除基本标记
大约 6 年之前 回复
dtu72460 我已经尝试了没有html5Mode和正确的URL,但结果仍然是相同的。
大约 6 年之前 回复
dp19001 ooops...我确实想念它。如果html5Mode为false,则需要在url中使用hash#
大约 6 年之前 回复
douzhuochao4027 肯定有一个<base>标签。我猜你错过了它。此外,无论html5Mode值如何,它都不起作用。
大约 6 年之前 回复
dongshao1981 听起来很像Laravel在尝试获取模板然后再次为您提供主URL时尝试检查您的权限或其他内容。我不知道Laravel是如何工作的。
大约 6 年之前 回复


在花了太多时间之后,我终于找到了问题所在。 事实证明,当URL是多个部分深度时(就像我的情况一样),必须在 templateUrl </ code>值之前添加正斜杠。 在我的情况下,它必须是这样的: /javascripts/statistics/index.html </ code>。</ p>

似乎这么简单的解决方案,但它引起了我太多 头痛。 如果有人遇到类似的问题,我会张贴此内容。</ p>

此功能归功于此答案 。</ p>
</ div>



After spending too much time on this, I finally found out what the problem was. As it turns out, when URL is multiple sections deep (like in my situation), a forward slash has to be prepended to the templateUrl value. In my case it had to be something like this: /javascripts/statistics/index.html.

Seems such a simple solution, but it caused me too much headache. I'm posting this in case anyone encounters a similar problem.

The credit goes to this answer.

douzou0073 是的,我很确定。 那是我改变的唯一一件事。
接近 6 年之前 回复
doushe8577 这对我不起作用:(你确定这是什么修好了吗?
接近 6 年之前 回复
Csdn user default icon