Question

我正在尝试使用$ http.jsonp显示API调用的结果，并使用Angular {{}}表达式显示它们，如下所示：

<!DOCTYPE html>
<html lang = "en" ng-app = 'twitchTV'>
<head>
    <script src = "..\repos\jquery.min.js"></script>
    <script src = "..\repos\bootstrap.min.js"></script>
    <script src = "..\repos\angular.js"></script>
    <link rel = "stylesheet" href="..\repos\bootstrap.min.css">
</head>


<body>
    <h1>Angular Twitch TV</h1>
    <div ng-controller = "twitchController as twitcher">
        <ul>
            <li ng-repeat = "user in twitcher.callResults">
                {{user}}
            </li>
        </ul>

    </div>
    <script>
        (function(){ 
            var app = angular.module('twitchTV', []);
            //Controller
            app.controller('twitchController', ['$scope','$http',function($scope,$http){
                //Users
                $scope.twitchUsers = ["freecodecamp", "storbeck", "terakilobyte", "habathcx","RobotCaleb","thomasballinger","noobs2ninjas","beohoff", "brunofin", "comster404"];
                //URLs
                var channelsBase = 'https://api.twitch.tv/kraken/channels/';
                var streamsBase  = 'https://api.twitch.tv/kraken/streams/';
                var cb = '?callback=JSON_CALLBACK';
                //Angular array for displaying results
                $scope.callResults = [];
                //Loop through users array
                $.each($scope.twitchUsers, function(key,value){
                    //Angular $http service call
                    $http.jsonp(channelsBase + value + cb).success(function(data){
                        //TWITCH API BASE: Status is GOOD
                        if(data.status!==422)
                        {
                            $scope.callResults.push(data);
                            console.log(data);
                        }//Closing:data.status !==422
                    });//Closing:$http.jsonp #1
                    //$scope.$apply();
                });//Closing:$.each
            }]);//Closing:app.controller
        })();//Clsoing:app.module
    </script>
</body>
</html>

但我在HTML {{}}显示中没有得到任何结果。我是否需要调用$ scope。$ apply以在$ http服务调用完成后更新View？

Answer 1

不确定您的版本是什么，但最近已弃用“成功”。尝试使用常见的'then'方法来响应$ http。

发出的承诺

https://docs.angularjs.org/api/ng/service/ $ HTTP

Angular JS＆amp; $ http.jsonp

1 个答案: