0

誰でもエラーを指摘できますか?私は基本的にこれらすべてに不慣れで、angularJSチュートリアル、API、およびその他のいくつかのリソースを使用して、これをすべてまとめてみましたが、あまり運がありませんでした。ハッシュタグに関する部分は無視してください。まだ何もしていません。コードがすべきことは、最初の入力タグの入力に応答することです。そこに入力されたもの (nameQuery) は、API へのアクセスに使用される文字列に連結されます。次に、その情報を取得して $scope.userID に保存し、userID を使用して userData と画像のリストを取得します。印刷できます。それは機能していませんが、私はしばらくそれを熟読してきましたが、実際には何の手がかりもありません. 経験豊富なプログラマーが私を助けてくれることを願っています!

HTML ファイル:

<!doctype html>
<html ng-app>

    <head>
        <meta charset="utf-8" />
        <title>Insta-Visualizer</title>
        <link rel="stylesheet" type="text/css" href="style.css"/>
         <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
         <script src="script.js"></script>

    </head>

    <body ng-controller="ImageCtrl">

        <div id="wrapper">

            <div id="header">
            <span class="title">Instagram Visualizer</span>
            </div>

            <div id="body">

                <div class="border">

                    <div id="search1">
                        Username <input ng-model="nameQuery">
                    </div>

                    <div id="search2">
                        Hashtag <input ng-model="hashtagQuery">
                    </div>

                </div>

                <div class="border">
                    <ul class="images">
                        <li ng-repeat="picData in imageList">
                            <img ng-src="{{picData.images.low_resolution}}"/>
                        </li>
                    </ul>
                </div>

            </div>

        </div>
    </body>
</html>

脚本:

var token = '1502600.bcf60cd.2ddf423a61534720beafdae05c4cf26f';

function ImageCtrl($scope, $http){

    var searchURL = 'https://api.instagram.com/v1/users/search?q=' + nameQuery
               + '&access_token=' + token;

    $http.get(searchURL).success(function(data) {
        $scope.userID = data.data.id;
    });

    var userDataURL = 'https://api.instagram.com/v1/users/' + $scope.userID
                      + '/media/recent/?access_token=' + token;

    $http.get(userDataURL).success(function(data) {
        $scope.userData = data;
        $scope.imageList = $scope.userData.data;
    });            

};
4

2 に答える 2

2

顕著なエラー:

  1. nameQueryにバインドされていません$scope
  2. 必要な情報がすべて揃っていない状態で 2 つの要求を行っています。
  3. jsonp メソッドを使用せずにクロスドメイン リクエストを実行しています。

AngularJS での REST サービスの使用に関するチュートリアルを読みましたか?

于 2013-07-09T00:35:22.483 に答える