问题 angular.js中的模板 - 继承


作为服务器端Web框架用户(我使用Django),我喜欢模板的组织方式。基本模板的页面标题,css,js,页眉和页脚被定义为块,可以在子模板中覆盖。

棱角分明的做法是什么?

每页的内容当然是由ng-view提供的,除此之外,我做不了多少。例如,标题标签位于视图之外,我无法动态更改它。

最好给我一个完整项目的示例代码,以了解模板的组织方式。大多数示例项目都很小,不需要在模板中继承。


10704
2017-12-05 02:39


起源



答案:


Django的模板非常好,但请记住,Angular主要用于构建SPA(单页面应用程序),因此它在概念上是不同的。在典型的Angular项目中,您将使用服务器端框架生成基本模板,然后将路由传递给Angular用于其他所有内容,并根据路由有条件地包含内容部分。

Django和Angular模板之间的一个相似之处是ng-include指令,它允许你吸收可重复使用的html。但是没有类似于Django的{{block}}或{{block super}}系统。

您可以编写一个自定义指令来引入额外的css / javascript,而不是使用{{block extrahead}}。

对于动态标题标记,您需要确保将控制器元素设置在head元素上方,否则它将超出范围,因此无法访问。我们在基本模板中这样做:

<title data-ng-bind="title">Oursite</title>

然后在该URL的控制器中:

$rootScope.title = 'Dashboard | Oursite';

其他建议的方法 这个 线。


6
2017-12-05 21:23





看一眼 角度块 它的灵感来自Jade,Handlebars和Django,或者更简单 NG-布局


4
2018-03-26 15:29



我尝试使用角度块,挣扎了一个小时但没有工作,你能帮我吗? - Shubham Badal


答案:


Django的模板非常好,但请记住,Angular主要用于构建SPA(单页面应用程序),因此它在概念上是不同的。在典型的Angular项目中,您将使用服务器端框架生成基本模板,然后将路由传递给Angular用于其他所有内容,并根据路由有条件地包含内容部分。

Django和Angular模板之间的一个相似之处是ng-include指令,它允许你吸收可重复使用的html。但是没有类似于Django的{{block}}或{{block super}}系统。

您可以编写一个自定义指令来引入额外的css / javascript,而不是使用{{block extrahead}}。

对于动态标题标记,您需要确保将控制器元素设置在head元素上方,否则它将超出范围,因此无法访问。我们在基本模板中这样做:

<title data-ng-bind="title">Oursite</title>

然后在该URL的控制器中:

$rootScope.title = 'Dashboard | Oursite';

其他建议的方法 这个 线。


6
2017-12-05 21:23





看一眼 角度块 它的灵感来自Jade,Handlebars和Django,或者更简单 NG-布局


4
2018-03-26 15:29



我尝试使用角度块,挣扎了一个小时但没有工作,你能帮我吗? - Shubham Badal