javascript - 将目录中的所有 JavaScript 文件包含到 AngularJS 中的 html 文件中?咕噜声?

标签 javascript angularjs gruntjs

在我的 AngularJS 应用程序中,我有很多 Controller js 文件。

这些 Controller (one.ctrl.jstwo.ctrl.js...)需要包含在我的 index.html 文件。

目录结构:

app/
   js/
      controllers/
         one.ctrl.js
         two.ctrl.js

目前,上述js文件包含在index.html文件中,如下所示。

index.html:

<!--   other html components   -->

<script src="js/controllers/one.ctrl.js"/>
<script src="js/controllers/two.ctrl.js"/>
</body>
</html>

将有更多 *.ctrl.js 文件需要包含在 index.html 中。

我需要一种方法来自动将 controllers 目录中的所有 *.ctrl.js 文件包含到 index.html 中。

调查结果:

从一些SO问题来看,

Load JavaScript and CSS files in folders in AngularJS

How can I include all JavaScript files in a directory via JavaScript file?

我发现它无法自动完成,需要一些服务器端脚本或构建工具。

我的问题:

目前,我正在使用 yeoman,其中包括 grunt 作为构建工具。 所以,我的问题是,目录中的那些javascript文件如何自动包含在html文件中?

最佳答案

您可以使用grunt-include-source插件

使用它您可以定义如下模板:

html: {
    js: '<script src="{filePath}"></script>',
    css: '<link rel="stylesheet" type="text/css" href="{filePath}" />',
  }

在您的 html 文件中,该文件将扩展为包含源位置中存在的所有源 js 和 css 文件,这些文件可以在 grunt 任务中配置

关于javascript - 将目录中的所有 JavaScript 文件包含到 AngularJS 中的 html 文件中?咕噜声?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24097146/

相关文章:

angularjs - Grunt 构建不会使用 Bower_components 填充 script.js

javascript - HTML2PDF自动打印

javascript - jQuery 选择器获取节点数组

angularjs - 在 Angular.js 中实现状态机来控制路由

javascript - Angular 如何通过单击 div 来检查复选框

javascript - Grunt-Contrib-Copy,如何在不覆盖目标文件夹中现有文件/文件夹的情况下复制保持相同文件夹结构的目录内容?

javascript - 使用 javascript 在 JSON 上未正确分配 URL

javascript - WebStorm 无法识别使用 webpack 别名导入的 Sass 文件

angularjs - 滚动页面时如何隐藏元素?

linux - 运行 var 中存储的命令时出现 Bash 错误 "command not found"