简体   繁体   English

AngularJs链接到ng-view html页面中的ng-include

[英]AngularJs linking to ng-include within ng-view html page

I am currently learning AngularJs and at the same time applying it to try and figure out how this viral movie site for the new x-men film was made ( http://www.trask-industries.com/#/innovation ) ...(you can google Trask Industries if you don't trust the link). 我目前正在学习AngularJs,同时将其应用于尝试弄清楚该新x战警电影的病毒电影网站是如何制作的( http://www.trask-industries.com/#/innovation ).. (如果您不信任该链接,则可以在Trask Industries上进行搜索)。 From what I can understand, the xmen site navigation pulls in the html templates to the ng-view and within this, the ng-include pulls in the content from further html templates. 据我所知,xmen站点导航将html模板拉到ng-view,在其中,ng-include从其他html模板拉出内容。 However, this is the exact same set up for each webpage but the content within ng-include changes and I don't understand how this is possible? 但是,这是为每个网页设置的完全相同,但是ng-include内的内容会更改,我不知道这怎么可能? I would have thought that if the content to change for each page, the ng-include would have to point at different html templates but its not obvious how this is being done. 我本以为,如果要更改每个页面的内容,则ng-include必须指向不同的html模板,但是这样做的方式并不明显。

Here is the code that is included within the template the ng-view is pulling in... 这是ng-view引入的模板中包含的代码...

<div id="two-column">
<div class="module_marquee"  ng-include="'modules/marquee.html'"></div>
<div class="module_list"  ng-include="'modules/list.html'"></div>
</div>

And as you can see, this code pulls in two further templates but its the same code for each page but the content changes depending on what link you click in the navigation. 正如您所看到的,该代码将引入另外两个模板,但每个页面的代码相同,但是内容会根据您在导航中单击的链接而变化。 I hope that all makes sense and any help that will provide an explanation will be most appreciated. 我希望一切都有意义,能提供解释的任何帮助将受到极大的赞赏。

They are most likely using ng-src to set the template along with the ng-include directive. 他们最有可能使用ng-src连同ng-include指令一起设置模板。 This article has details and examples: http://blog.dynamicprogrammer.com/2012/09/19/dynamic-includes-with-angular-js.html 本文提供了详细信息和示例: http : //blog.dynamicprogrammer.com/2012/09/19/dynamic-includes-with-angular-js.html

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM