0

我试图在模块中分离我的应用程序。我有一个登录模块和应用程序的其余部分。我的想法是用户必须先登录才能访问应用程序的其余部分。为此,我使用了两个具有不同配置的 angular.module,但我无法动态地让 angular 解析新的 app.js 并在我的 webapp 上使用它的配置。

//index.html
<div data-ng-app="login" ui-view></div>

//login.js
.state('user.signin', {
            url: '/signin',
            templateUrl: 'login.html'
        })
        .state('appUIView', {
            url: '/appUIView',
            templateUrl: 'appUIView.html',
            resolve: {
                deps: ['uiLoad',
                  function( uiLoad ){
                    return uiLoad.load( [
                                            'js/app.js'//I try resolving the app.js so I can now use it's configuration
                                        ]);
                }]
            }
        })
 //appUIView.html
 <div data-ng-app="app" ui-view></div>//uses the app defined in app.js


 //app.js
 $urlRouterProvider
    .otherwise('/app');//when app.js is loaded if the new configuration is used the page should land on app.html
 $stateProvider   
        .state('app', {
            url: '/app',
            templateUrl: 'app.html'
        })

http://plnkr.co/edit/FOAegZmmWjuPeWp3VhBe

谢谢您的帮助!

4

2 回答 2

1

我使用一些服务器端 MVC(ASP.NET MVC,但我相信您可以使用任何类似的平台完成它)来为我们用于内部应用程序的一组 AngularJS 模块完成此操作。我只需设置一个 ViewBag 属性,该属性可以由 MVC 中的(共享)页面模板获取,例如

<html ng-app="@ViewBag.NgApp">

此 ViewBag 属性由我的服务器端路由设置,因此对 /App1 的请求将为该捆绑包提供脚本,包括相关的模块定义。/App2、/App3 等也是如此。/App1 下的任何内容都由 SPA 的客户端路由处理(我们使用 ui-router)。

值得关注的是为 Angular 2.0 创建的路由器,但被移植回 1.3 - 这应该支持在单个应用程序中动态加载子应用程序/路由器。我希望这意味着动态加载应用程序模块......

于 2014-11-04T15:18:50.707 回答
1

Angular 中的 webapp 通常有 1 个 ng-app 模块。

最合理的做法是,如果你真的需要两个独立的应用程序,那就是开发两个独立的 angulars 应用程序。您可以让登录模块重定向到托管应用程序安全版本的页面。当然,这意味着您必须进行常规重定向,从而触发浏览器重新加载。

您还可以在 1 个应用程序中拥有多个 ng-apps。在这种情况下,您必须使用引导程序在它们之间切换。但是,除非有非常好的理由,否则我不会诉诸于此。这似乎有点骇人听闻。

angular.bootstrap(document.getElementById('app'),['app']);
于 2014-11-04T10:46:43.430 回答