通过自定义指令访问Api

时间:2018-04-04 07:20:14

标签: angularjs

我只能通过自定义指令访问api时只能获取10个对象。任何人都可以提出建议吗?

以下是代码。有人可以帮忙吗? specialCard指令不访问下面的数据。

mainView.html

        <div class="panel panel-primary col-sm-offset-2 col-xs-12 col-sm-8">
<special-card></special-card>
</div>
</div>

postcard.html

<div class="post-preview" ng-repeat="book in BooksData">
        <div class="panel panel-primary col-sm-offset-2 col-xs-12 col-sm-8">
            <div class="panel-heading"> <h4>Book - {{book.name}}</h4></div>
            <div class="panel-body"> 
                <div>Author - <em>{{ book.authors[0] }}</em> </div>
                <div>Publisher - <em>{{ book.publisher}}</em> </div>
                <div>ISBN - <em>{{ book.isbn}}</em> </div>
                <br>
                <a class="btn btn-primary" ng-href="#/{{type}}/{{book.isbn}}"> Details</a>
            </div>
        </div>
</div>
</div>

app.js     var myApp = angular.module('blogApp',['ngRoute']);

myApp.directive("specialCard",function(){

       return{
        restrict : "E",
        templateURL : "views/post-card.html",
        controller : function($scope){

        }
    }
});

myApp.controller('mainController',['$http','$scope',function($http,$scope) {

           $http.get('https://anapioficeandfire.com/api/books').success(function(data){

            $scope.BooksData= data;
            console.log($scope.BooksData);

        });
}]);

myApp.controller('characController',['$http','$scope',function($http,$scope) {

           $http.get('https://www.anapioficeandfire.com/api/characters?page=1&pageSize=20').success(function(data1){

            $scope.charData= data1;
            console.log($scope.charData);

        });
}]);


myApp.controller('houseController',['$http','$scope',function($http,$scope) {

           $http.get('https://anapioficeandfire.com/api/houses?page=1&pageSize=20').success(function(data2){

            $scope.houseData= data2;
            console.log($scope.houseData);

        });
}]);

路线

myApp.config(['$routeProvider', function($routeProvider){
    $routeProvider

        .when('/',{
            // Which controller it should use 
            controller      : 'mainController',
            // what is the alias of that controller.
            controllerAs    : 'main'
        })
        .when('/books',{
            templateUrl     : 'views/mainView.html',
            controller      : 'mainController',
            controllerAs    : 'main'
        })
        otherwise(
            {
                //redirectTo:'/'
                template   : '<h1>404 page not found</h1>'
            }
        );
}]);

1 个答案:

答案 0 :(得分:0)

用这样的问题帮助你是不可能的。

首先,请按照本文的建议:How do I ask a good question?

然后不要粘贴任何链接到GitHub仓库,直接在问题中提供代码(并且格式正确),如果可以的话,可以使用一些示例(在Plunkr,Jsfiddle等上演示)