javascript - jQuery 加载 <script> 但在 AngularJS 下不评估相同内容

Question

我正在开发一个单页应用程序，我打算尽可能保持模块化。另外，这将是一个相当大的应用程序，因此，我打算仅在加载关联 View 时才加载 Controller 。为了实现相同的目标，我按以下方式构建了我的代码:

app.js

var app = angular.module("app", ['ngRoute']).config(function($httpProvider) { 
    $httpProvider.defaults.headers.common['X-Requested-With'] = "XMLHttpRequest";
    $httpProvider.defaults.headers.post['Content-Type'] = "application/x-www-form-urlencoded; charset=utf-8";
});

路由.js

app.config(function($routeProvider) {
    $routeProvider.when("/user/login", {
        templateUrl: "/user/login.html",
        controller: "LoginCtrl"
    });
});

用户/login.html

<script type="text/javascript" src="/js/user/login.js"></script>
<div>
    <!-- Complete Login Form -->
</div>

js/user/login.js

app.controller("LoginCtrl", function() {
    // Login related functionality
});

现在，我面临的问题是 login.html 模板加载正确。此外，正在发送 login.js 请求并成功接收响应。但是，我仍然收到来自 AngularJS 的错误，说 LoginCtrl 是 undefined。我对此进行了研究，发现包含 jQuery 可以解决问题，但这并没有发生。我尝试在 login.js 文件中添加一个简单的警报，但弹出窗口也没有出现。

非常感谢您在此事上的任何帮助。

Answer 1

您需要更改登录 Controller 的位置

app.config(function($routeProvider) {
    $routeProvider.when("/user/login", {
        templateUrl: "/user/login.html",
         //controller: "LoginCtrl" // remove this
    });
});

并像这样替换html

<script type="text/javascript" src="/js/user/login.js"></script>
<div ng-controller="LoginCtrl">
    <!-- Complete Login Form -->
</div>