Question

我想在加载视图内容之前调用javascript函数，因为我想在body标签中添加一个类“light_theme”。所以我必须在加载视图之前添加这个类，以便一切看起来都很完美。

但目前AngularJs广告类在视图中加载后会使事情变得有些奇怪。

例如，默认情况下，主题背景颜色为黑色，但在添加该类后，它会突然改变背景颜色和其他颜色方案突然看起来不太好。

这就是我想在加载视图之前添加该类的原因。我研究过但无法得到任何好的解决方案。

如果真的可以吗？

Answer 1

不要使用jquery来解决这个问题。您可以在运行阶段执行此操作，您可以访问该URL。 if url == some-url然后添加class或者更好地在$ state object上添加另一个名为theme的属性。

app.run(function ($rootScope) {
  $rootScope.$on("$stateChangeStart", function(event, toState, fromState){

    if (toState.theme === "xyz") {
        $('div').addClass('themeClass');
    } else {
        $('div').removeClass('themeClass');
    }

  });
});

Answer 2

您应该使用'resolve'（在状态提供程序配置中），它将始终确保在您向用户显示路由器（状态提供程序）加载的视图之前调用该函数

例如，您有状态'news'的视图，我们需要调用来获取消息数据：

.when("/news", {
    templateUrl: "newsView.html",
    controller: "newsController",
    resolve: {
        message: function(messageService){
            return messageService.getMessage();
        }
}

然后在newsController中你可以将messageData称为正常注入：

app.controller("newsController", function ($scope, message) {
    $scope.message = message;
});

可以找到更多信息here

Answer 3

一种方法是使用data-ng-init

在视图中调用$scope.init()，将在加载视图时调用它。

类似的东西：

<div class="wrap-items" data-ng-init="init()">
...
..
</div>

现在，在范围的init函数中，您可以更改类。

如何在加载视图之前调用函数？

3 个答案: