Question

我花了几个小时尝试在线提供的所有不同方法，但没有任何效果。我只是想加载一个脚本，以便在加载所有图像后运行。 Angular有什么东西不允许我这样做吗？我正在使用$routeProvider：

var photos = {
    name: 'photos',
    url: '/photos',
    views: {
        main: {
            templateUrl: "views/photos/photos.html",
            controller: function($scope,$http){
                $http({
                    url: 'get/photos',
                    method: "POST"
                })
                    .success(function (data, status, headers, config) { 
                        $scope.data = data;
                        // this doesn't work
                        $(window).load(function() {
                            myScript();
                        });
                    })
                    .error(function (data, status, headers, config) { $scope.status = status; });
            }
        }
    }
};

顺便说一句，我在控制台中没有收到任何错误。

Answer 1

在我看来，http POST调用会检索照片。而且我认为myScript是一个函数。那么为什么不尝试这个：

var photos = {
    name: 'photos',
    url: '/photos',
    views: {
        main: {
            templateUrl: "views/photos/photos.html",
            controller: function($scope,$http){
                $http({
                    url: 'get/photos',
                    method: "POST"
                })
                .success(function (data, status, headers, config) { 
                    $scope.data = data;
                    myScript();
                })
                .error(function (data, status, headers, config) {
                    $scope.status = status;
                });
            }
        }
    }
};

因为myScript函数仅在POST成功后运行。我假设data指的是实际的图像数据。

Answer 2

我不知道我是否真的明白你想要获得什么类型的数据，但我认为你可以尝试承诺

Angular中的

$ http已经返回包含在.success或.error中的promise，但你也可以使用.then（）回调，就像其他所有的承诺一样

因此，如果问题是等待success（）回调完成，你可以这样做，用几个then（）替换它：

$http.post(...).then(
                //function which will wait for the data to be downloaded
                //here you can alter data, check some values etc...
               ).then(
               //the script for what you want after
               myScript();
               );

我做了一个小小的解释：http://jsfiddle.net/Kh2sa/2/

它使用$ timeout来模拟一个很长的响应时间，所以你必须等待3个secondes才能看到你的修改数据，它会保持其初始状态，直到你调用myScript（）函数

Answer 3

AFAIK，Angular没有提供在图片加载完成后通知我们的方法。您需要为此编写自己的指令。该指令将包装必要的JavaScript / jQuery代码，该代码将检测一个或多个图像的已完成加载条件。

jQuery callback on image load (even when the image is cached)和https://github.com/desandro/imagesloaded可能会有所帮助。

如何在所有照片加载后设置脚本运行？

3 个答案: