Javascript 角度渲染主视图两次，而不是加载正确的模板_Javascript_Php_Angularjs_Laravel_Angular Ui Router

Javascript 角度渲染主视图两次，而不是加载正确的模板

javascript php angularjs laravel

Javascript 角度渲染主视图两次，而不是加载正确的模板,javascript,php,angularjs,laravel,angular-ui-router,Javascript,Php,Angularjs,Laravel,Angular Ui Router,我在使用角度模板时遇到了一个问题-主视图（最初加载的视图）不是包含正确的模板，而是rendernd两次。在花了过去两天的大部分时间试图解决这个问题后，我仍然一事无成更详细的说明：我正在使用Angular开发一个用于管理网站内容的单页应用程序。该网站的其余部分由Laravel构建。Angular仅用于内容管理系统，该系统是一个独立的应用程序，受Laravel的HTTP过滤器和身份验证系统的保护当Angular应用程序不位于根URL（例如，http://application.dev有效，而h

我在使用角度模板时遇到了一个问题-主视图（最初加载的视图）不是包含正确的模板，而是rendernd两次。在花了过去两天的大部分时间试图解决这个问题后，我仍然一事无成

更详细的说明：

我正在使用Angular开发一个用于管理网站内容的单页应用程序。该网站的其余部分由Laravel构建。Angular仅用于内容管理系统，该系统是一个独立的应用程序，受Laravel的HTTP过滤器和身份验证系统的保护

当Angular应用程序不位于根URL（例如，

http://application.dev

有效，而

http://application.dev/admin

不会）

主代码（为了找到问题，将其精简为基本代码）：

应用程序视图：

<!DOCTYPE html>
<html lang="en" ng-app="Dashboard">
    <head>
        <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/">
    </head>
    <body>
        <div id="container" class="full">
            <header>
                <nav>
                    <ul>
                        <li><a ui-sref="statistics">Statistics</a></li>
                        <li><a ui-sref="notifications">Notifications</a></li>
                    </ul>
                </nav>
            </header>
            <div id="content" ui-view></div>
        </div>
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.24/angular.min.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.10/angular-ui-router.min.js"></script>
        <?php echo HTML::script(asset('javascripts/main.js')) ?>
    </body>
</html>

每次我使用

templateUrl

选项（

template

显然有效，因为没有包含任何文件），它都不包含正确的模板。相反，另一个请求被激发到

http://application.dev/admin

URL，它在收到

200 OK

状态代码后基本上复制了整个视图。我曾尝试使用Chrome的开发工具来缩小问题的范围——唯一不寻常的是请求发起人是通常应该包含的模板（或URL）。不幸的是，这没有多大帮助

我有点怀疑这个问题可能是由Laravel的路由或URL重写引起的，但我还没有能够验证它。你知道这种行为的原因是什么吗

编辑：

添加了

routes.php

文件，以防可能导致此问题。

在这方面花费了太多时间后，我终于发现了问题所在。事实证明，当URL有多个部分深度时（就像在我的情况中），必须在

templateUrl

值前面加一个正斜杠。在我的例子中，它必须是这样的：

/javascripts/statistics/index.html

这似乎是一个简单的解决办法，但它让我太头疼了。我发布这篇文章是为了防止任何人遇到类似的问题

这要归功于。

在花了太多时间之后，我终于发现了问题所在。事实证明，当URL有多个部分深度时（就像在我的情况中），必须在

templateUrl

值前面加一个正斜杠。在我的例子中，它必须是这样的：

/javascripts/statistics/index.html

这似乎是一个简单的解决办法，但它让我太头疼了。我发布这篇文章是为了防止任何人遇到类似的问题

这要归功于。

听起来很像Lavarel在尝试获取模板，然后再次向您提供主URL时，试图检查您的权限或其他内容。我不知道拉瓦雷是怎么工作的。@charlietfl肯定有一个

标签。我猜你错过了。而且，不管HTML5模式的值是多少，它都不起作用。如果html5Mode为false，则需要在url@charlietfl我在没有

HTML5模式的情况下尝试了这个方法，并且使用了正确的URL，但是结果仍然是一样的。如果你有http://application.dev/admin#/statistics
作为url，但失败了。您的laravel路由中存在错误。但也可以在不使用HTML5模式时删除基本标记听起来很像Lavarel在尝试获取模板并再次为您提供主URL时尝试检查您的权限或其他内容。我不知道拉瓦雷是怎么工作的。@charlietfl肯定有一个
标签。我猜你错过了。而且，不管HTML5模式的值是多少，它都不起作用。如果html5Mode为false，则需要在url@charlietfl我在没有HTML5模式的情况下尝试了这个方法，并且使用了正确的URL，但是结果仍然是一样的。如果你有http://application.dev/admin#/statistics作为url，但失败了。您的laravel路由中存在错误。但也可以在不使用HTML5模式时删除基本标记这对我不起作用：（你确定这是修复它的方法吗？是的，我确定。这是我唯一改变的。这对我不起作用：（你确定这是修复它的方法吗？是的，我确定。这是我唯一改变的方法。）。
<!DOCTYPE html>
<html lang="en" ng-app="Dashboard">
    <head>
        <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/">
    </head>
    <body>
        <div id="container" class="full">
            <header>
                <nav>
                    <ul>
                        <li><a ui-sref="statistics">Statistics</a></li>
                        <li><a ui-sref="notifications">Notifications</a></li>
                    </ul>
                </nav>
            </header>
            <div id="content" ui-view></div>
        </div>
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.24/angular.min.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.10/angular-ui-router.min.js"></script>
        <?php echo HTML::script(asset('javascripts/main.js')) ?>
    </body>
</html>

<section id="statistics">
    <h3>Statistics</h3>
</section>

Route::group(
    [
        'namespace' => 'Admin',
        'prefix' => 'admin'
    ],
    function () {
        Route::group(
            [
                'namespace' => 'Account'
            ],
            function () {
                Route::group(
                    [
                        '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'
        ]);
    }
);