javascript - Angular js ng-repeat is getting duplicated on using $apply? -
i developing simple angular , node js app.it uses twitter streaming api.on end using express , socket.io along "twit" library.
now here server.js
var express=require('express'); var http=require('http'); var app=express(); var server=http.createserver(app); var io=require('socket.io').listen(server); server.listen(8080); var twit=require('twit'); app.use(express.static(__dirname+'/public')); app.get('/',function (req,res) { console.log("awd"); res.sendfile(__dirname+'/index.html'); }); var target=['ferrari']; var api=new twit({ consumer_key:'xxxx', consumer_secret:'xxxx', access_token:'xxxx', access_token_secret:'xxxx' }); io.sockets.on('connection',function(socket){ var stream=api.stream('statuses/filter',{track:target}) stream.on('tweet',function(tweet){ console.log(tweet.text); io.emit('stream',tweet); }); });
everything fine @ back-end. in front-end side using angular js this-
<!doctype html> <html ng-app="twitter"> <head> <title>twitter</title> <script src="https://cdn.socket.io/socket.io-1.3.7.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js"></script> <script type="text/javascript"> ( function(){ var app=angular.module("twitter",[]); i=0; app.controller("tweets",['$scope',function($scope){ var socket=io(); $scope.list=[]; socket.on('stream',function(tweet){ $scope.$apply(function(){ $scope.list.push({name:tweet.text}); }); }); }]); } )(); </script> </head> <body> <div ng-controller="tweets"> <div ng-repeat="t in list"> <div>{{t.name}}</div> </div> </div> </body> </html>
best part getting response want-
rt @sonautosporno: ferrari https://t.co/o6vjavpf6i ferrari california t https://t.co/bfg4sxh9mb je roule dans la ferrari et toi tu marche avec ta jalousie. o/
but dom doesn`t looks correct.
every time new tweet broadcasted $apply seeing change creating new ng-repeat element instead of appending new info inside single div.
what possibly going wrong??
Comments
Post a Comment