0

我是 Angular 新手，正在开发我的第一个“真实”应用程序。我正在尝试构建一个日历/日程安排应用程序（源代码都可以在github上看到），如果有用户登录，我希望能够更改内容（即显示与他们相关的详细信息），但这是问题所在：

  1. 我不希望应用程序依赖于登录用户（需要可以配置为公开、私下或两者兼而有之）

  2. 如果可以避免，我不想在此应用程序中实现用户/登录（我希望最终将我的应用程序包含在另一个应用程序中，在该应用程序中可能会实现但不一定使用任何特定的安全框架或仅限于任何)

我有一个想法，即创建一些user可以通过我的应用程序引用的全局变量，或者如果我必须实现一个系统来在这个应用程序中完成所有这些，我可以以某种抽象的方式这样做，以便可以注入不同的选项在。

我的一些想法或对我应该做什么的理解可能是完全错误的并且对基本原理一无所知，但我真的不知道我应该采取什么方法来做到这一点。

如果它是相关的，我目前没有任何后端，但最终希望使用 MongoDB 存储和 nodejs 服务，但我也想尝试保持开放，以允许其他人使用不同的存储/后端，如 sql 和php

有没有user可以从另一个（父级？）应用程序注入/填充的全局变量/服务？

如果是这样，最好的方法是什么？如果不是，为什么以及我应该采取什么方法以及为什么？

更新

我相信在线评论和向我提出的一些建议，服务将是最好的选择，但是我将如何从父应用程序注入此应用程序服务？

4

4 回答 4

3

如果您的（单个）页面由服务器动态呈现并且服务器知道您是否已登录，那么您可以执行以下操作：

动态渲染一个脚本标签，它产生：

<script>
     window.user = { id: 1234, name: 'User A', isLoggedIn: true };
</script>

对于未登录的用户：

<script>
     window.user = { isLoggedIn: false };
</script>

为了方便起见，将用户复制到 Angular 的 IOC 中的一个值：

angular.module('myApp').value('user', window.user);

然后，您可以在 DI 中使用它：

angular.module('myApp').factory('myService', function(user) {
    return {
        doSomething: function() {
            if (user.isLoggedIn) {
                ...
            } else {
                ...
            }
        }
    };
});

一些棘手的事情（在做 [SEE COMMENTS] 之前你应该做两次）正在扩展$scope：

angular.module('myApp').config(function($provide) {
    $provide.decorator('$controller', function($delegate, user) {
        return function(constructor, locals) {
            locals.$scope._user = user;
            return $delegate(constructor, locals);
        };
    });
});

这段代码装饰了$controller服务（负责构造控制器），基本上说$scope对象在传递给控制器​​之前，将通过_user属性得到增强。

让它自动 $scoped 意味着你可以在任何地方直接使用它：

<div ng-if="_user.isLoggedIn">Content only for logged-in users</div>

这是有风险的，因为您最终可能会遇到与原始 $scope API 或您在控制器中添加的属性的命名冲突。

不用说，这些东西只在客户端运行，很容易被篡改。您的服务器端代码应始终检查用户并返回正确的数据子集或接受正确的操作。

于 2013-11-05T17:45:42.263 回答
2

是的，您可以在 $rootScope 中执行此操作。但是，我认为将它放在服务中是更好的做法。服务是单例的，这意味着它们在整个应用程序中保持相同的状态，因此非常适合存储用户对象之类的东西。在我看来，使用“用户”服务而不是 $rootScope 只是更好的组织。尽管从技术上讲，您可以获得相同的结果，但一般来说，您不想在 $rootScope 中过度填充功能。

于 2013-11-05T17:11:19.990 回答
1

您可以在 中拥有一个全局user对象，$rootScope并将其注入到所有控制器中，只需将其放入控制器的参数中，就像使用$scope. 然后您可以通过简单的检查来实现功能：if($rootScope.user). 这允许您以user任何您想要的方式和您想要的位置对对象建模，充当全局变量，在 Angular 的域内和使用 DI 的良好实践。

于 2013-11-05T16:56:24.317 回答
0

只是为了添加我的评论和您的编辑。如果您希望能够重用您的用户服务并将其插入其他应用程序，则代码如下所示。

angular.module('user', []).service('userService', [function(){
   //declare your user properties and methods
}]) 

angular.module('myApp', ['user'])
.controller('myCtrl', ['userService', '$scope', function(userService, scope){
    // you can access userService from here
}])

不确定这是否是您想要的，但同样您可以让您的“用户”模块依赖于另一个“父”模块并以相同的方式访问该模块的数据。

于 2013-11-05T21:24:08.957 回答