3

nodejs サーバーに、配列を返す API があります。

[
  "123_ayesha098",
  "3ar7hkung",
  "aali",
  "Abdelhak",
  "adityaputra",
  "adraga",
  "agnusdark",
  "ahkeno",
  "ahmedjubayer",
  "ahsan_hq",
  "akenygren",
  "alexfuser",
  "alexlakatos",
  "alexxed",
  "alfasst",
  "amaciel"
  ...
  ...
]

このリストを表示しようとしています

  <div class="list-group" ng-repeat="name in contributors">
    <!-- Links to detail level -->
    <a href="#/contributors/{{ name }}" class="list-group-item">
      <strong>Contributor: </strong> {{ name }} <br>
    </a>
  </div>

このように表示されています

Contributor: {"0":"1","1":"2","2":"3","3":"_","4":"a","5":"y","6":"e","7":"s","8":"h","9":"a","10":"0","11":"9","12":"8"} 
Contributor: {"0":"3","1":"a","2":"r","3":"7","4":"h","5":"k","6":"u","7":"n","8":"g"} 
Contributor: {"0":"a","1":"a","2":"l","3":"i"} 
Contributor: {"0":"A","1":"b","2":"d","3":"e","4":"l","5":"h","6":"a","7":"k"} 
Contributor: {"0":"a","1":"d","2":"i","3":"t","4":"y","5":"a","6":"p","7":"u","8":"t","9":"r","10":"a"} 
Contributor: {"0":"a","1":"d","2":"r","3":"a","4":"g","5":"a"} 

ここに正しく表示するにはどうすればよいですか?

これを行った後

  <pre>{{ contributors | json }}</pre>

私はページでこれを取得しています

[
  {
    "0": "1",
    "1": "2",
    "2": "3",
    "3": "_",
    "4": "a",
    "5": "y",
    "6": "e",
    "7": "s",
    "8": "h",
    "9": "a",
    "10": "0",
    "11": "9",
    "12": "8"
  },
  {
    "0": "3",
    "1": "a",
    "2": "r",
    "3": "7",
    "4": "h",
    "5": "k",
    "6": "u",
    "7": "n",
    "8": "g"
  },
  {
    "0": "a",
    "1": "a",
    "2": "l",
    "3": "i"
  },

これはservice.js

listOfContributors: $resource('/transifex/listOfContributors', {}, {
  query: {
    method: 'GET',
    params: {},
    isArray: true
  }
}),

controller.js

$scope.contributors = Transifex.listOfContributors.query();

そして `app.js

$routeProvider.when( "/trans/contributors", { templateUrl: "partials/transifex/userlist.html", controller: "TransifexSplattrController"});
4

1 に答える 1

9

まず、API から回答を受け取ったら、「contributors」変数を次のように設定します。

$http({method: 'GET', url: apiservice})
    .success(function(data, status, headers, config) {
        $scope.contributors= data;
    });

あなたのhtmlであなたは:

 <div class="list-group">
        <!-- Links to detail level -->
        <a ng-repeat="name in contributors" 
            href="#/contributors/{{ name }}" 
            class="list-group-item">
          <strong>Contributor:</strong> {{ name }}</a><br>
     </div>

ng-repeat を配置した要素は繰り返されます。必要だと思います。

<div>
<a ..../a>
<a ..../a>
<a ..../a>
</div>

そしてそうではない

<div>
<a ..../a>
</div>
<div>
<a ..../a>
</div>
<div>
<a ..../a>
</div>

$http を Controller 宣言に挿入する場合にのみ使用できます。

myModule.controller('MyController',function($scope, $http) {

  // all your controller code

}
于 2013-11-14T20:01:56.303 に答える