Question

所以我在这里提出第一个问题。我试图使用ng-repeat从服务器渲染数据，但它没有显示任何内容。这是我的控制器的代码

.controller('ExampleController', function($scope, $http) {   
var url = "https://lari.jumpstart.ge/en/api/v1/commercial_banks?callback=JSON_CALLBACK";

       $http.jsonp(url)
            .success(function(data) {

                $scope.results =   data.results;
          })
            .error(function(data) {
              alert("ERROR");
            });


});

这是我视图中的ng-repeat

<ion-pane>
      <ion-header-bar class="bar-stable">
        <h1 class="title">Ionic Blank Starter</h1>
      </ion-header-bar>
      <ion-content >
          <ion-item ng-controller='ExampleController' ng-repeat='x in results'> 


         {{x.code}} 


</ion-item>
      </ion-content>
    </ion-pane>
  </body>
</html>

这是服务器上的数组

{  
   "valid":true,
   "results":[  
      {  
         "code":"BAGA",
         "name":"Bank Of Georgia",
         "currencies":[  
            "AED",
            "AMD",
            "AUD",
         ]
      },
      {  
         "code":"TBCB",
         "name":"TBC Bank",
         "currencies":[  
            "AED",
            "AUD",
            "AZN", 
         ]
      },

Answer 1

$ http会返回一个承诺。检查控制台中的错误，看看它说的是什么。查看将控制器中的代码移动到工厂/服务中，然后将此控制器或服务返回的任何值分配给$ scope

Answer 2

如果您在服务器上提供的数组示例是正确的，那么您需要做的就是将$scope.results = data.results;更改为$scope.results = data.results.results;，否则它将无法迭代数组你的回复数据。另一方面，如果这不起作用，请尝试将{{x.code}}更改为{{x}}以查看输出结果。

Answer 3

错误的代码在与ng-controller指令相同的节点上具有ng-repeat指令。

<!-- Replace THIS
<ion-content >
     <ion-item ng-controller='ExampleController' ng-repeat='x in results'> 
         {{x.code}} 
     </ion-item>
</ion-content>
-->

<!-- With THIS -->
<ion-content ng-controller='ExampleController' >
     <ion-item ng-repeat='x in results'> 
         {{x.code}} 
     </ion-item>
</ion-content>

ng-repeat指令需要位于ng-controller的子节点上。

ng-repeat不会从Jsonp Server呈现数组项

3 个答案: