Question

我只是angularjs的初学者，我正在创建一个应用程序，我已经正确地输出了但我想在不使用jQuery的情况下实现它，我想使用angularjs方式使用“ng -repeat“即可。

以下代码是我的控制器内部的代码：

.controller('SomeListCtrl',function(SomeFromService, $scope, $stateParams, $http){

var encodedString = 'action=' + 
        encodeURIComponent("getSomething") +
        '&count=' +
        encodeURIComponent("10") + 
        '&page=' +
        encodeURIComponent("1");

$http({
    method: 'POST',
    url: 'http://service.something/site.aspx',
    data: encodedString,
    headers: {'Content-Type': 'application/x-www-form-urlencoded'}
})
.success(function(data){
    $scope.myData = data;
})
.error(function(data, status){
    console.log(status);
})
})

这是我的html，我需要传递它：

<ion-view view-title="Latest News">
  <ion-content>
    <ion-list>
      <ion-item class="item-remove-animate item-avatar item-icon-right" ng-repeat="data as myData" type="item-text-wrap" href="#/tab/myLink/{{data.id}}">
        <img ng-src="http://the-v.net{{data.ImageLink}}">
        <h2>{{data.localTitle}}</h2>
        <i class="icon ion-chevron-right icon-accessory"></i>
      </ion-item>
    </ion-list>
  </ion-content>
</ion-view>

P.S。 ajax调用返回的数据是json。这是以这种方式构建的

[{
"id": "5f6e8bac-197f-4ae3-8535-6d892a101d17",
"localTitle": "Public"
}]

Answer 1

AngularJS控制器旨在不在代码中直接使用/创建HTML元素。您可以使用视图/ HTML来呈现AJAX响应返回的值。

控制器

... 
$scope.values = [];

...
.success(function (response,status, headers, config){
    // put the response values in a scope object
    $scope.values = response;
})
...

查看

<!-- render the values using ng-repeat -->
<div ng-repeat="value in values">
    {{value.localTitle}}
</div>

参考

Answer 2

https://docs.angularjs.org/api/ng/directive/ngRepeat

只需在带有范围的控制器中声明您的json数据，然后在视图中使用它

controller.js

$scope.myObj = 'http response here';

view.html

<table>
   <tr ng-repeat="data as myObj"> 
     <td>{{data.localTitle}}</td>
   </tr>
</table>

如何正确应用Angularjs ng-repeat？

2 个答案: