Question

我有一个从服务器检索数据的异步函数，我有一个指令，它应该显示异步函数检索的数据。

我想要做的是在我的指令中将ng-show置于false中，假设除非我将ng-show置于true中，否则不会加载该指令。在我的异步函数检索数据之前，ng-show将保持为假。

事情是这不起作用，无论我是否在其上放置ng-show，该指令都会加载 - 还有其他想法吗？

这是我在代码中尝试过的：

Js：

 getFile.then(function (result) {
                        $scope.show = true;
                        Utilities.safeApply($scope);
                    })

Html：

section class="list file-list group" ng-show="show" view-mode="assets">
    <file file="model.file"></file>
</section>

指令：

.directive('file', ['$rootScope', '$compile', function($rootScope, $compile) {
        return {
            restrict: 'E',
            replace: true,
            templateUrl: 'file.html',
            scope: {
                show: '='
            },
            controller: function($scope) {
                //do stuff here once async function finished
            }

Answer 1

ngShow和ngHide仅显示和隐藏内容，他们不会有条件地添加或从页面中删除它。如果您真的想要这种行为，请查看ngIf。

然而，我认为您的问题会更好地解决在您的指令中设置一个在内容准备就绪时起作用的观察者。这是解决问题的“更有棱角的”方式，因为它依赖于数据绑定。

.directive('file', ['$rootScope', '$compile', function($rootScope, $compile) {
    return {
        restrict: 'E',
        replace: true,
        templateUrl: 'file.html',
        scope: {
            file: '=', // YOU DIDN'T HAVE THIS YET
        },
        controller: function($scope) {
            $scope.$watch('file', function (newValue) {
                if (!newValue) { return; }
                // do async code here. $scope.file will be defined
            };
        }

正如另一张海报所提到的那样，可能必须调用$ scope。$ apply（）在收到Ajax调用结果后触发摘要周期。这取决于getFile方法的外观。如果它使用Angular的核心服务之一，如$http，您可能不需要手动搞乱摘要周期。

Answer 2

您是否尝试过在函数结束时（或之后）调用$ scope。$ apply（）？这在类似的情况下对我有用。我认为这与从angular之外更新$ scope有关。

免责声明：我不知道这是不是很好的做法，但我已经被迫使用它几次使用异步功能，它可以做我想做的事情

如何在指定时间之前停止执行指令？

2 个答案: