Question

每当我尝试访问本地/ bootstrapped变量时，我的AngularJS应用程序都会停止加载。为什么？我做错了什么？

我正在保存一个变量，名为＆＃34; bootstrapData，＆＃34;到一个页面。我可以通过检查Chrome中的元素来查看变量...

<script type="text/javascript">var bootstrapData = {"userInfo":{"name":"Joe Blow","emailAddress":"joe.blow@nowhere.com","gravatar":"https://secure.gravatar.com/avatar/asdf?s=48&r=x&d=retro"},"token":"asdf"};

然后我尝试加载该变量。如果存在这个IF块，Angular永远不会加载......很多超时，Chrome基本上都被锁定了。如果我发表评论并重新加载，应用程序（和我的本地变量）将加载正常...

angular.module('myApp').
factory('Identity',
['$window', 'Profile',
    function($window, Profile){
        var _currentUser;

        if (!_currentUser && !!$window.bootstrapData) {
            console.log('Loading user from bootstrap data');
            _currentUser = new Profile();
            angular.extend(_currentUser, $window.bootstrapData.userInfo);
            $window.bootstrapData = null;
        }

        return {
            currentUser: _currentUser,
            isAuthenticated: function(){
                return !!this.currentUser && this.currentUser.token && this.currentUser.token.length > 0;
            }
        };
    }
]);

配置文件服务本身是空的......只是资源对象的占位符......

angular.module('myApp').
    factory('Profile',
    //['$resource',
    //    function($resource){
    //
    //        var _profileResource = $resource('/api/users/:id', { _id: "@id" }, {
    //            update: { method: 'PUT', isArray: false }
    //        });
    //
    //        return _profileResource;
    //    }
    //]
    function(){
        var _profileResource = {};

        return _profileResource;
    }
);

Answer 1

上面的代码工作正常（参见plunker），如果有人对注入的Profile服务做了什么假设，因为它被用作构造函数new Profile()。

具体来说，如果定义如下 - 我正在更改名称，使其更清楚我所指的是：

.factory("ProfileSvc", function ProfileFactory(){
  function Profile(){
    // constructor function
  }

  return Profile;
});

然后，注入的ProfileSvc服务实例将是构造函数function Profile(){...}：

.factory("anotherSvc", function(ProfileSvc){

   // ProfileSvc here is a function object
   var profile = new ProfileSvc();
});

那么，function ProfileFactory是什么？

这只是一个创建ProfileSvc实例的函数。它也可以是一个匿名函数。至少在这个简单的例子中，你只是返回一个对象 - 一个函数对象 - 你也可以把它写成.constant

.constant("ProfileSvc", function Profile(){ });

或.value：

.value("ProfileSvc", function Profile(){ });

.factory，.service，.value和.constant只是创建注入的 singleton 服务实例的不同方法。

局部变量打破了AngularJS

1 个答案: