javascript - 我的 $scope 变量中的元素不会显示

Question

我刚刚部署了一个网站来在“生产”中进行测试，但是当我尝试访问该网站时，我的某些计算机不会看到我的 ng-repeat 的结果，而有些计算机会看到。如果我在没有显示任何内容时访问该网站，我会查看源代码，并看到数组中每个对象的 ng-repeat，但屏幕上没有 html 输出。这是我加载 Controller 时的一些代码:

/**
 * Function that send a request to get a list of posts.
 * @return {Function} A promise.
 */
function retrievePosts() {
    var defered = $q.defer();
    // If the user is logged in we do a search by country, otherwise we get all the posts.
    if($rootScope.user !== null && $rootScope.user !== undefined) {
        PostService.searchPost({ countries: [$rootScope.user.country] }, function(err, posts) {
            if(err) {
                defered.reject(err);
            }
            else if(posts && posts.length > 0) {
                defered.resolve(posts);
            } 
            // If the previous condition is not true, we try to get all the posts, since the search by country didn't work.
            else {

                 PostService.getAllPosts(function(err, posts2) {
                    if(err) {
                        defered.reject(err);
                    } else {
                        defered.resolve(posts2);
                    }
                });
            }
        });

    } else {
        PostService.getAllPosts(function(err, posts) {
            if(err) {
                defered.reject(err);
            } 
            else {
                defered.resolve(posts);
            }
        });
    }
    return defered.promise;
}

该函数用于获取 JSON posts 对象的数组。然后我像这样执行 q.all :

$q.all([retrieveManufacturer(), retrieveCategories(), retrievePosts(), getTotalPosts(), retrieveGalleryPosts()]).then(function(results) {
    $scope.manufacturers = results[0];
    $scope.categories = results[1];

    // Here we must cache the result and slice it, so that angular doesn't render 
    // a tone of post but 10 at a time.
    postCache = results[2];
    $scope.numberOfPostsToShow = 10;
    $scope.posts = postCache.slice(0, $scope.numberOfPostsToShow);

    // Some code to display the proper amount of post for each category.
    var i = -1;
    var max = results[3].length;
    var groupedPostsCount = { };
    var group;

    while(++i < max) {
        group = results[3][i];

        // "_id" contains the name of the category.
        groupedPostsCount[group._id] =  group.count;
    }

    if(Object.keys(groupedPostsCount).length > 0){
        $scope.categoriesPostCount = groupedPostsCount;
    }

    $scope.galleryPosts = results[4];

    // Prepare the $scope.galleryPosts to be bound with posts.
    buildGallery($scope.galleryPosts);

}, function(err) {
    console.log(err);
});

$q.all 中的每个任务都会被执行并全部得到解决。我在 HTML 中看到它们，例如类别、制造商等...结果 [2] 是帖子数组，不为空，它们确实有 500 个帖子。我尝试在 buildGallery() 方法调用后调用 $scope.$apply() ，但没有任何效果。如果我在 html 中的任何位置打印 {{ posts }} 我会看到帖子数组。但是当他们处于 ng-repeat 状态时:

<div class="ad-container" ng-repeat="post in posts" ng-click="viewPostDetails(post)">
                    <div class="ad-picture">
                        <table class="wrapper">
                            <tr>
                                <td><img ng-src="img/175/{{ post.mainImageName || post.imgUrls[0] }}" alt="No image provided"/></td>
                            </tr>
                        </table>
                    </div>
                    <div class="ad-info">
                        <span class="ad-info-title">{{ post.title }}</span>
                        <span class="ad-info-price">{{ post.country == 'Canada' ? (post.price | currency : "CA$") : (post.price | currency : "US$") }}</span>

                        <br />
                        <span>{{ post.country }}, {{ post.province }}, {{ post.createdAt | date }}</span>

                        <p>{{ post.description }}</p>
                    </div>
                </div>

当然，这段代码位于一个绑定(bind)了 Controller 的 div 内。就像我说的，这真的很奇怪。在我的开发计算机上，一切工作正常，但我 friend 的一些计算机可以工作，而另一些则不能。这是网站 www.firearmsbin.com 的链接，也许问题会出现在您的计算机上。我尝试了 firefox、firefox for dev、edge、chrome 和 IE11。

谢谢。

Answer 1

我发现是adblock没有显示我的div，它是“广告容器”类。因此，CSS 中包含“ad”一词的每个类都会被阻止。