Question

我在尝试编写JS框架时遇到了一些问题。我想基本上在我的HTML中定义1个JavaScript文件，如下所示：

<script src="framework.JS"></script>

我打算使用$ .getScript将多个JavaScripts包含在一个文件中：

然而，当我尝试包含一个Angular控制器时，它不起作用。

$.getScript('controller.js', function() { ...

相反，我收到控制台错误：

未捕获错误：[$ injector：modulerr]无法实例化模块framework.ui，原因如下：错误：[$ injector：nomod]模块＆＃39; framework.ui＆＃39;不可用！您要么错误拼写了模块名称，要么忘记加载它。如果注册模块，请确保将依赖项指定为第二个参数。

实施例： http://plnkr.co/edit/FDcZM4PHOokRFza5eUaO?p=preview

在index.html中，如果你注释掉这一行：

<script src="script.js"></script>

并取消注释上述行：

<!--  <script src="controller.js"></script> -->

你会发现它一切正常。

我真的很感激这方面的一些帮助。

Answer 1

首先，最好不要将JQuery与Angular混合使用。

问题在于，当Angular引导时，它希望所有模块都已包含但是JQuery在Angular引导之后加载该模块。

实际上，在99％的情况下，不需要延迟加载模块。实施它是非常重要的问题。在所有常见情况下，最好在将所有Angular的模块包含到页面之前连接它们。查看this article了解更多详情。

我个人使用以下gulp任务来执行连接：

gulp.task('concat', function() {
    return gulp.src([
            'js/**/angular.js', // _allways_ include angular first
            'js/**/!(*mock*|angular.js|angular.min.js).js' // exclude mocks and angular to avoid oncluding it twice
        ])
        .pipe(sourcemap.init({loadMaps: true})) // I use sourcemaps to see my _files_ in debugger, not only modules
        .pipe(concat('app.js'))
        .pipe(sourcemap.write({
            includeContent: false,
            sourceRoot: '/home/myself/projects/myProject/js'
        }))
        .pipe(gulp.dest('public/js'));
});

gulp.task('watch', function() {
    gulp.watch('js/*.js', ['concat']);
});

使用JQuery $ .GetScript将Angular控制器加载到另一个脚本中

1 个答案: