AngularJS：如何鸟巢应用的角度范围内的应用程序 [英] AngularJS: How to nest applications within an angular app

问题描述

我一直对一个项目，更像是一个框架，有可以安装几个应用程序/模块。看它像一个基本的AppStore或google.play商店。这有点内联网应用，并且所有模块可以添加到您的useraccount。

i've been working on a project that is more like a framework, and has several apps / modules you can install. See it like a basic appstore or google.play store. It's sort of an intranet application, and all modules can be added to your useraccount.

框架已经在发展，但现在我包装我周围的应用程序/模块的主意头。 （链接到发展理念的证明，都可以在这里找到）

the framework is already in development, but i'm wrapping my head around the applications/modules idea now. (link to a proof of concept in development, can be found here)

应用程序应该有点独立的，并不能一下子包括框架脚本，这是完全有可能通过构建他们在单独的模块，像这样：

an application should be somewhat standalone, and not able to suddenly include scripts from the framework, This is perfectly possible by structuring them in separate modules like so:

angular.module('myApp', []);

然而，一个应用程序可以有模板，脚本，CSS，它可以在独立的服务器上运行，所以我有种找获取脚本（S）和cssfile（S）和动态加载的最佳方式进入应用程序，当用户从框架内启动应用在

• 我目前正在构建的应用程序，如果他们有例如主模板 www.framework.com/apps/myapp/views/app.html ，为求简单捆绑我的脚本集成到每个应用程序1脚本文件，所以也有一个 www.framework.com/apps/myapp/script.js 被包括在内。

• currently I'm structuring apps as if they have a main template for example www.framework.com/apps/myapp/views/app.html, for the sake of simplicity i bundle scripts into 1 script file per application, so there is also a www.framework.com/apps/myapp/script.js to be included.

该框架包含加载的应用程序模板，一个 AppController的。该模板包含这件作品：

The framework contains a template that loads the apps, and an appController. The template contains this piece:

<div data-ng-controller="AppController" data-ng-include="app.appTemplate">
    <div>loading...</div>
</div>

这基本上绑定到 $ scope.app.appTemplate 当所有的脚本加载时更新，所以首先它显示了一个装载模板，脚本都包含在以后的后该页面会更新 app.appTemplate 上面提到的应用程序的主模板。

this basically binds to the $scope.app.appTemplate which is updated when all scripts are loaded, so first it shows a loading template, later after scripts are included in the page it updates the app.appTemplate to the above mentioned main template of an application.

在加载的第一个索引模板工程，这个模板目前装有 AppController的从框架，所以它是使用 $范围的框架，而不是它自己的脚本。

while loading the first index template works, this template is currently loaded with the AppController from the framework, so it is using the $scope of the framework and not it's own script.

我还是必须以某种方式启动应用程序本身的角度模块，并让它在它自己没有在框架中运行任何东西使它工作

我还在思考如何最好地加载依赖JavaScript文件（可能会使用requrejs或其他依赖装载机），但我现在不知道如何'启动'的应用，但不从框架的<$ C $内工作C> AppController的

I'm still figuring out how to best load the dependent javascript files (will probably use requrejs or other dependency loader) but I have currently no clue how to 'boot' the app without working from within the framework's AppController

修改

我创建了一个小型示范项目，以显示手头上的问题，满code是可见git-此刻枢纽这个项目做了几件事情很难codeD，这个想法是我做那些不太硬codeD时，我得到的概念权的证明，现在它是所有关于加载应用程序的框架内。如果可能的话，我可以想到哪里得到的URL和应用程序名称从...

I created a small demo project to show the problems at hand, full code is visible at git-hub at the moment this project does a few things hard coded, the idea would be that I make those less hard coded when I get the proof of concept right, now it's all about loading the applications within the framework. if that is possible, I can think of where to get the URL's and application names from ...

推荐答案

您不能自举在另一个自举模块的模块。引导编译视图并绑定一个rootScope它，穿越它是通过DOM方法和设置范围绑定，并通过执行指令功能连接的所有道路。如果你这样做了两次，你会遇到的问题。

You can't bootstrap a module inside another bootstrapped module. Bootstrapping compiles the view and binds a rootScope to it, traversing it's way through the DOM and setting up scope bindings and executing directive linking functions all the way through. If you do that twice, you're going to run into problems.

您很可能将不得不重新考虑你的架构。我想也许这个词模块或应用程序，因为它涉及到角是用词不当，并引导你走上错误的道路。

You're probably going to have to rethink your architecture. I think perhaps the word "module" or "app" as it pertains to Angular is a misnomer and is leading you down the wrong path.

在应用程序中每个用户安装的应用程序或许应该真正通过控制你的应用程序模块中的控制，或注册您的应用程序模块引用的模块。所以，你不会是启动多个应用程序，你真的只是利用这些模块控制器来控制屏幕上视图的部分首发之一，引用其他模块，然后。

Each "user installed app" in your application should probably really be controlled by a controller in your app module, or registered to a module referenced by your app module. So you wouldn't be "starting up multiple apps", you'd really just be starting one, referencing the other modules, then using Controllers from those modules to control parts of your view on the screen.

什么你会做的是，当一个新的小部件被安装，你注册它的模块文件（.js文件）的系统，这将包含一个名为WidgetCtrl，然后装你的页面的时候，你就会控制器引用您的应用程序模块上的小部件的模块。从那里，它应该采用NG-控制器和/或NG-包括可用于动态分配到的元素。

What you'd do is when a new "widget" was installed, you're register it's module file (.js) with the system, which would contain a controller named WidgetCtrl, then when your page loaded, you'd reference the widget's module on your app module. From there it should be available for dynamic assignment to elements using ng-controller and/or ng-include.

我希望是有道理的。

这篇关于AngularJS：如何鸟巢应用的角度范围内的应用程序的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！