更新 $scope 不会影响视图答案

【问题标题】：Update $scope doesn't affect the view更新 $scope 不会影响视图
【发布时间】：2016-04-16 04:00:12
【问题描述】：

我正在尝试从 promise 回调中更新 $scope.loading。我尝试使用 $scope.$apply 但无法正常工作。

loading 是我的视图中使用的一个变量，如果数据尚未加载，则显示加载栏，否则显示数据。

这是我的控制器：

angular.module('ecommerce')
    .controller('ProductsCtrl', function ($scope, ProductsService) {
        $scope.loading = true;
        $scope.error = false;
        ProductsService.getProducts().then(function (data) {
            $scope.loading = false;
            $scope.products = data;
        }, function (response) {
            $scope.products = null;
        });
});

这是我的看法：

<div ng-show="{{loading}}">Loading... please </div>
<div ng-hide="{{loading}}">

但我一直看到加载消息，即使数据已成功加载。

【问题讨论】：

{{}} 是当您想要在 UI 上显示某物的值时，{} 通常是当您想要在一个表达式或一组表达式中使用该值时。如果您希望在 ng-hide、ng-show 和其他少数几个中表达自己的值，则不要使用 {}。

标签： javascript angularjs scope angularjs-scope

【解决方案1】：

摆脱{{ 和}}。您的 ng-show 和 ng-hide 指令应如下所示：

<div ng-show="loading">Loading... please </div>
<div ng-hide="loading">

请参阅 ng-show 和 ng-hide 的文档。

【讨论】：

【解决方案2】：

随便放{{}}。根据ng-show 文档

<div ng-show="loading">Loading... please </div>
<div ng-hide="loading">

这里是Demo

【讨论】：