将ng-repeat表列值传递给数组

时间:2015-08-23 16:08:27

标签: angularjs angularjs-ng-repeat ng-repeat

在表单中搜索艺术家或歌曲后,将返回一个歌曲表,其中的列标题是与歌曲相关的信息的描述。我的目标是只将“Track Id”列值发送到数组以供以后使用。例如,如果返回五首歌曲并且各个轨道ID为111,222,333,444和555,那么我想要一个数组,比如说“trackids”是trackids = [111,222,333,444和555] ]。我正在考虑两种方法;做类似于获取特定列的getelementbyId / tag或者将song.trackId数据直接发送到“trackids”数组。这是代码:

<body>

  <div ng-controller="iTunesController">
 {{ error }}
    <form name="search" ng-submit="searchiTunes(artist)">
      <input type="search" required placeholder="Artist or Song" ng-model="artist" />
      <input type="submit" value="Search" />
    </form>
<div class="element"></div>
    <table id="SongInfo" ng-show="songs">
      <thead>
        <tr>
          <th>Album Artwork</th>
          <th>Track</th>
          <th>Artist</th>
          <th></th>
          <th>Track Id</th>
          <th>Preview</th>
          <th>Track Info</th>
          <th>Track Price</th>
        </tr>
      </thead>
      <tbody>
        <tr ng-repeat="song in songs">
          <td><img ng-src="{{song.artworkUrl60}}" alt="{{song.collectionName}}" />
          </td>
          <td>{{song.trackName}}</td>
          <td>{{song.artistName}}</td>
          <td>
            <button ng-click="handleAdd(song)">Add Track</button>
          </td>
          <td>{{song.trackId}}</td>
          <td><a href="{{song.previewUrl}}">Play</a></td>
          <td><a href="{{song.trackViewUrl}}">View Track Info</a></td>
          <td>{{song.trackPrice}}</td>
        </tr>
      </tbody>
    </table>
</div>
</body>

itunes_controller.js

(function() {

  angular.module('app', [])
    .controller('iTunesController', function($scope, $http) {

      $scope.searchiTunes = function(artist) {
        $http.jsonp('http://itunes.apple.com/search', {
          params: {
            'callback': 'JSON_CALLBACK',
            'term': artist,
            limit: 5,
          }
        }).then(onSearchComplete, onError)
      }
var onSearchComplete = function(response) {
        $scope.data = response.data
        $scope.songs = response.data.results
      }

      var onError = function(reason) {
        $scope.error = reason
      }

    });


}())

任何帮助都表示赞赏,并提前致谢!!

1 个答案:

答案 0 :(得分:0)

首次返回数据时获取ID怎么样?

var onSearchComplete = function(response) {
        $scope.data = response.data
        $scope.songs = response.data.results
        $scope.trackIds = [];
        angular.forEach($scope.songs, function(song) {
            $scope.trackIds.push(song.trackId)
        }) // trackIds are now stored in $scope.trackIds
      }