Question

我很困惑，我有这个模块路由到不同的控制器：

var mainModule = angular.module('lpConnect', []).
    config(['$routeProvider', function ($routeProvider) {
    $routeProvider.
        when('/home', {template:'views/home.html', controller:HomeCtrl}).
        when('/admin', {template:'views/admin.html', controller:AdminCtrl}).
        when('/connect', {template:'views/fb_connect.html', controller:MainAppCtrl}).
        otherwise({redirectTo:'/connect'});
}]);

和像这样的公共服务：

mainModule.factory('Common', ['$rootScope', '$http', function (scope, http) {
        var methods = {
            changeLanguage:function (langID) {
                http.get('JSON/langs/' + langID + '/captions.json').success(function (data) {
                    scope.lang = data;
                });
            },
            initChat:function () {
                console.log(scope); // full object
                console.log(scope.settings); // undefined
            }
        };

        //initiate
        http.get('JSON/settings/settings.json').success(function (data) {
            scope.settings = data;
            methods.changeLanguage(scope.settings.lang);
        });


        return methods;
    }]);

应用加载并获取（通过XHR）设置对象，我可以看到设置反映在我的DOM中。（例如字幕）

现在当我从HomeCtrl调用initChat方法时，我在尝试访问scope.settings属性时得到一个未定义的值...奇怪的是当我记录范围时我可以看到设置对象...什么是我错过了？

enter image description here

更新：我发现我做错了是直接从控制器主体调用我的方法：

function HomeCtrl($scope, $location, Common) {
...
Common.initChat()
...
}

如果我将通过点击触发的调用更改为一切正常，但我确实需要在页面加载时运行此代码，这是什么方法？

Answer 1

这是一个简单的问题，我认为：在$ http调用检索scope.settings之前，你在你的作用域中调用了initChat。

Answer 2

一些事情。

http是异步的，这是你的主要问题（正如Andy精明地指出的那样）
ng-init不建议用于生产代码，在控制器中初始化更好
初始化您的scope.settings = {}或一个不错的默认值可能会对您有所帮助，一旦xhr完成，您的设置就可以使用。

希望这会有所帮助

- 丹

AngularJS - 了解范围

2 个答案: