angularjs – 加载相对templateUrl

前端之家收集整理的这篇文章主要介绍了angularjs – 加载相对templateUrl前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我一直在试图找到最好的方式来创建一个模块化,可扩展的角度应用程序。我真的很喜欢像 angular-boilerplateangular-app这样的项目的结构,其中所有相关的文件被分组在一起的功能的局部和指令。
project
|-- partial
|   |-- partial.js
|   |-- partial.html
|   |-- partial.css
|   |-- partial.spec.js

但是,在所有这些示例中,模板URL相对于基本网址加载,而不是相对于当前文件

angular.module('account',[])
.config(function($stateProvider) {
  $stateProvider.state('account',{
    url: '/account',templateUrl: 'main/account/account.tpl.html',// this is not very modular
    controller: 'AccountCtrl',});
})

这不是很模块化,并且可能变得难以在大型项目中维护。我需要记住改变templateUrl路径每次我移动任何这些模块。这将是很好,如果有一些方法加载相对于当前文件的模板,如:

templateUrl: './account.tpl.html'

有什么办法做这样的角度?

我想你最终会发现维护相对于js文件的路径将更难,如果甚至可能。当发货时间,你很可能想要将所有的javascript文件连接到一个文件,在这种情况下,你要的模板是相对于baseUrl。此外,如果你通过ajax抓取模板,Angular默认除非你预先将它们包装在$ templateCache,你肯定会想要他们相对于baseUrl,所以服务器知道在哪里找到他们一旦你的js文件已经发送到浏览器。

也许你不喜欢让它们相对于baseUrl在开发中的原因是因为你没有在本地运行服务器?如果是这样,我会改变。这将使你的生活更容易,特别是如果你要与路线工作。我会检出Grunt,它有一个非常简单的服务器,你可以在本地运行模仿一个生产设置称为Grunt Connect.你也可以检出一个像Yeoman项目,它提供了使用Grunt预包装前端开发环境,所以你don不得不花费大量的时间来设置。 @L_404_5@项目是用于本地开发的Grunt设置的一个很好的例子。

原文链接:https://www.f2er.com/angularjs/146026.html

猜你在找的Angularjs相关文章