Question

我正在为我的页面使用角度js。当我在我的localhost上运行它时，它需要去远程服务器获取一些数据。我从＆＃39; $ http.get＆＃39;获取数据这实际上有点延迟（3-4秒）所以，意思是 - 而html页面看起来很难看。我需要阻止在返回响应数据之前显示页面。

我怎样才能做到这一点？

任何建议都将受到高度赞赏。

Answer 1

您可以在您的范围中添加一个变量＆＃39; false＆＃39;默认情况下。当您的＆＃39; $ http.get＆＃39;呼叫完成后，将变量设置为＆＃39; true＆＃39;。

使用＆＃39; ng-show =＆＃34;变量＆＃34;＆＃39;无论你想隐藏什么。只要该变量设置为＆＃39; true＆＃39;它就会显示。例如。当＆＃39; $ http.get＆＃39;电话已经完成。

更新：如果你想让它变得更加花哨，你可以为你的变量使用类而不是true / false，并使用＆＃39; ng-class =＆＃34;变量＆＃34;＆＃39;设计页面样式。通过这种方式，你可以使用一个类，让我们说“隐藏”。隐藏页面。然后将其更改为＆＃39;显示＆＃39;当＆＃39; $ http.get＆＃39;通话完成。这样，您就可以使用CSS3过渡。

我相信还有其他选择，但这可能是一个简单的解决方案。为了获得最佳解决方案，您应该提供更多信息。（如何进行通话，何时进行通话，......）

Answer 2

你有两种解决方法

ng-cloak：您必须像这样添加：
```
<body ng-cloak="">
```

你也需要在你的主css文件中的某个地方使用这个类。

[ng\:cloak], [ng-cloak], .ng-cloak {
  display: none !important;
}

这样可以防止不必要的闪烁。 Link to docs

或2.您可以使用ng-route resolve

你应该从你的路线返回一个承诺，并且只有在重新承诺承诺后才能改变路线。

.when('/article/:id', {
    templateUrl: 'app/article/article.html',
    controller: 'ArticleController',
    resolve: {
        article: ['$http', '$route', function ($http, $route) {
            return $http.get({ contentId: $route.current.params.id }).$promise;
        }]
    }
})

在得到$ http.get的回复之前，请不要显示该页面

2 个答案: