arrays - AngularJS は promise から返された配列を更新しません

Question

YouTube API にデータを照会した後に問題が発生しました。jsfiddle.net/YBvQJ/4/を試してみたい場合に備えて、この jsfiddle で問題が再現されています。

問題は次のとおりです。何かを初めて検索すると、結果が正しく表示されます。しかし、2 回目の検索を実行すると、検索が正しく実行されたにもかかわらず、ビューで結果が更新されません。

$http を使用して youtube API を呼び出し、パラメータを指定して検索を行うサービスがあります。戻り値は約束です:

.service('youTubeSearchService', ['$log', '$http', '$q', ($log, $http, $q) ->
  apiKey = 'myApiKey'
  url = 'https://www.googleapis.com/youtube/v3/search'
  deferred = $q.defer()
  return service =
    search: (query) ->
      $http.get(url, params: {
          key: apiKey
          type: 'video'
          maxResults: '6'
          part: 'id,snippet'
          fields: 'items/id,items/snippet/title'
          q: query
      })
      .success (data) ->
        $log.info "In success"
        $log.info data
        deferred.resolve data.items.map (item) ->
            videoId: item.id.videoId
            title: item.snippet.title
      .error (data) ->
        $log.info "In error"
        $log.info data
        deferred.reject data
      return deferred.promise
])
.config(['$httpProvider', ($httpProvider) ->
  # Disable this header or the youtube API won't work
  delete $httpProvider.defaults.headers.common['X-Requested-With']
])

このサービスは、コントローラーで次のように使用されます。

.controller('SearchCtrl', ['$log', '$scope', 'youTubeSearchService'
  , ($log, $scope, youTubeSearchService) ->
      $scope.search = ->
        $scope.results = youTubeSearchService.search($scope.query)
  ])

データはビューで次のように使用されます。

<input type="text" ng-model="query" value="ejemplo">
<button ng-click="search()">Search in YouTube</button>
<li ng-repeat="item in results">
    <p><a target="blank" href="//www.youtube.com/watch?v={{item.videoId}}">
        {{item.title}}
    </a></p>
</li>

YouTube API が新しい配列を返すことを示すために、サービスにログ呼び出しを入れました。

ビューでスコープが更新されていないことに問題があると思われます。プロミスは $digest サイクルを呼び出し、ng-click ディレクティブも呼び出すため、そうすべきではありません。

助けていただければ幸いです。前もって感謝します。