局部变量 break AngularJS

Question

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

我正在将一个名为 "bootstrapData," 的变量保存到页面。我可以通过检查 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 服务实例的不同方式.

局部变量 break AngularJS

Local variables break AngularJS

angularjs

angularjs-service