【问题标题】:access $rootScope in resolve and root index.html file在解析和根 index.html 文件中访问 $rootScope
【发布时间】:2016-10-19 19:47:17
【问题描述】:

两件事-

我的 index.html 头部有一个供应商脚本,我想将一个特定于环境的变量传递给该脚本。

<script type="text/javascript">!function () {analytics.load(--->code here<----);();</script>

我已将变量附加到运行块中的 $rootScope,但在加载此 html 时它似乎还没有准备好。我可以用

记录相同的代码
<a data-ng-click="$log.log('code', code)">code</a>

但在运行 head 标签时它似乎还没有准备好。

另外 - 我有一些附加到 $rootScope 的其他值在解析运行时不可用。它在服务中未定义。如果我在该服务中执行 console.log 并在 run 块中执行 console.log,则服务首先记录为 undefined,然后在执行 run 块时,它已正确设置。

我需要做什么才能在根 index.html 文件的头元素和解析中使用这些变量?

resolve: {
    auth: ['service', function (service) {
        return service.resolve()
    }]
}

service.resolve 为页面呈现之前所需的变量依赖项调用许多不同的服务。

更新

我之前提到的 resolve 是一个 $route.resolve 函数。它被放置在 routeProvider 中并在页面加载之前运行。

templateUrl: '/user.html',                    
controller: 'User',
controllerAs: 'user',
resolve: {
    auth: ['service', function (service) {
        return service.resolve()
    }]
}

解析函数内容-

self.profilePromises().then(function (resp) {
    //this resp object is an array of promises that are mostly put into rootscope and/or used as params for other app setup functions - all things that need to be ready before the page resolves

    var map = self.resultMap

    for (var i = 0; i < resp.length; i++) {

        $rootScope[map[i]] = resp[i].data.data

        switch (map[i]) {
            case 'abc':
                $rootScope.abc = resp[i].data
                break
            case 'def':
                setUser(resp[i].data.data)
                break
            // etc
        }
    }
    return $q.when({auth: true})

}, function (resp) {
    return $q.reject({auth: false})
})

$route.resolve 可以采用多个函数参数,这些参数必须在页面初始化之前执行。这是我找到的获取加载页面所需变量的最佳方法。因此,它们通常是获取用于填充页面的用户数据的服务,例如在登录后。我试图附加到 rootScope 的这些变量来自我们的构建,它将传递相对于生产或 QA 的主机和端口参数。换句话说,我想在构建应用程序时根据环境分配这些域。

【问题讨论】:

  • 你试过angular.element(document).scope()吗?
  • 我应该把这个准确地放在哪里?
  • 请在head 中查看我关于访问$rootScope 的回答。另外,resolve 方法何时执行?它属于哪个服务?请显示完整代码

标签: javascript angularjs rootscope dependency-resolver


【解决方案1】:

我已将变量附加到运行块中的 $rootScope,但是 加载此 html 时,它似乎还没有准备好。

$rootScope 在 Angular 经历引导过程并创建 $injector 时可用。提升过程可以通过ng-app 指令或angular.bootstrap 方法启动。在任何情况下,都必须在 DOM 准备好时调用它们,因为没有 DOM 元素,角度无法引导。 head 块中的所有脚本都在 DOM 准备好之前执行,因此此时您无法访问 $rootScope

【讨论】:

  • 感谢您对 head 标签的回答。我想我会发布另一个关于解决的问题。
猜你喜欢
  • 1970-01-01
  • 2022-01-10
  • 2017-02-26
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2011-12-28
相关资源
最近更新 更多