javascript - Angular 加载更多推文 onclick

Question

对 Angular 来说相当陌生，正在构建一个 Twitter 流，在点击事件上加载缓存的推文。我看到的问题是，在单击加载更多按钮之前加载推文。我不理解与推文范围的绑定(bind)。下面是相关代码:

html:

      <button ng-if="moreTweets" ng-click="loadMoreTweets()">Load More Tweets</button>
      <div  ng-repeat="tweet in tweets" class="tweetContainer" ng-bind-html="tweet" ></div>

工厂:

    angular.module('TweetService', ['ngResource'])
     .factory('TweetData', function ($resource) {
       return $resource('/2/messages', {}, {
        query: { method: 'GET', isArray: false }    
       })
     })

Controller :

  .controller('MainCtrl', function ($scope, $timeout,TweetData) {
    $scope.tweets = [];
    var allTweets = [];        
    (function tick() {
       TweetData.get({payload: $scope.payload},function(data){
              tweethandler(data)
              $timeout(tick, 5000);
        })
    })();

    $scope.loadMoreTweets = function(){
      $scope.moreTweets = false;
      $scope.tweets = allTweets;
    }


    var tweethandler = function(body){
      var tweets = messages.map(function(body.messages) { return encodeTweet(body.messages.tweet); });
      if (tweets.length>0){
           $scope.moreTweets = true;
           Array.prototype.unshift.apply(allTweets, tweets);
           $scope.payload = body.next_request;
      } 
    }
  }

初始加载时会显示“加载更多推文”按钮。之后，每当更新 allTweets 时，在单击按钮之前 $scope.tweets 也会更新。

Answer 1

这是预期的行为。您将 $scope.allTweets 分配给 $scope.tweets ，从而创建对该数组的引用。这意味着当对 $scope.allTweets 或 $scope.tweets 进行更改时，更改将针对这两个变量指向的同一对象进行。

如果您想要 allTweets 的子集，您应该仅使用它们推送或创建一个新数组