如何使用Angular.js引导多个模块显示在同一页面上 [英] How do I bootstrap multiple modules to display on same page with Angular.js

查看:95
本文介绍了如何使用Angular.js引导多个模块显示在同一页面上的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我查看了 Google群组 angularjs.org 以及一些严肃的谷歌搜索,但我没有找到任何明确的例子或解释什么我正在尝试。

I have looked on the Google groups, angularjs.org as well as some serious Googling but I am not finding any clear examples or explanation for what I'm trying to do.

我想要做的是使用多个模块将我的应用程序分解为视图。我知道从在线阅读你需要手动引导但我仍然没有写它

What I am trying to do is break my application into views using multiple modules. I know from reading online you need to manually bootstrap but I'm still not getting it write

我目前有2个模块thermostatApp和PeopleApp,我想要将它们附加到下面显示的自己的容器中:

I currently have 2 modules "thermostatApp" and "PeopleApp", and I want to attach them to their own containers shown below:

<div id="thermostatApp_container">
    <div data-ng-include="'modules/thermostat/thermostat.html'"/> 

  </div> 

  <div id="peopleApp_container">
    <div data-ng-include="'modules/people/people.html'"/> 

  </div>

我试图做的是引导到每个容器元素,如下所示:

what I was trying to do was to bootstrap to each container element like so:

angular.element($('#peopleApp_container')).ready(function() {
         angular.bootstrap($('#peopleApp_container'), ['peopleApp']);
       });

 angular.element($('#thermostatApp_container')).ready(function() {
         angular.bootstrap($('#thermostatApp_container'), ['thermostatApp']);
       });

这对我不起作用,我知道你可以使用一组模块附加多个模块但是你如何指定一个元素来引导它?有可能做我正在描述的事情吗?如果不是最好的方法是什么?我确实想让模块尽可能分开。

This isn't working for me, I know you can attach multiple modules using an array of modules but How do you specif a element to bootstrap it to? Is it possible to do what I'm describing? If not what is the best way to approach it? I do want to keep modules as separated as possible.

推荐答案

我觉得很傻!我不需要附加到特定元素,我只是附加到文档并传递了一系列模块,如下所示:

I feel very Silly! I did't need to attach to specific elements, I just attached to the document and passed an array of modules like so:

angular.element(document)).ready(function() {
    angular.bootstrap(document, ['peopleApp','thermostatApp']);
});

这篇关于如何使用Angular.js引导多个模块显示在同一页面上的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆