2016-09-23 53 views
0

我正在为移动应用程序使用angularJS + cordova。我能够显示列表视图,因为我试图更新列表项,当我点击该项目时,值正在改变,但用户界面没有更新。 这是我的代码。AngualrJS范围变量正在更新,但不是UI

<md-list post class="" role="list" > 
     <md-item class="card" ng-repeat="post in posts"> 
      <div class="card-header"> 
       <div class="pro-pic"> 
        <img src="{{post.UserImage}}" /> 
       </div> 
       <h2>{{ post.UserName }} 
        <span>{{ post.CreatedDate | date:'medium' }} via --</span> 
       </h2> 
       <div class="post-info">{{ post.Description }}</div> 
      </div> 

      <div class="card-body"> 
       <div class="card-img" ng-hide="post.IdeaImagePost == 0"> 
        <img src="{{ post.IdeaImagePost }}" /> 
       </div> 
      </div> 

      <div class="card-footer"> 
       <div id="likeID" ng-click="onLike(post)"><i class="fa fa-thumbs-up {{post.LikeUserStatus ? 'active' : ''}}"></i><label>&nbsp;Like</label><span class="badge badge-xs badge-pink">{{ post.LikeUsersCount }}</span></div> 
       <div><i class="fa fa-commenting"></i>&nbsp;Comment<span class="badge badge-xs badge-pink">{{ post.CommentsCount }}</span></div> 
      </div> 
     </md-item> 
    </md-list> 

查看更多

这里是JS代码

$scope.onLike = function(post) { 
    console.log("LikeUserStatus: " + post.LikeUserStatus); 
    post.LikeUserStatus = !post.LikeUserStatus; 
    post.LikeUsersCount = post.LikeUserStatus ? parseInt(post.LikeUsersCount)+1 : parseInt(post.LikeUsersCount)-1; 

    console.log("LikeUserStatus: " + post.LikeUserStatus); 
}; 
+0

你在哪里看到值发生了变化? – ni3aj

+0

我可以打印控制台日志 – Avinash

回答

0

console.log("LikeUserStatus: " + post.LikeUserStatus); 
 
` $timeout(function(){ 
 
    post.LikeUserStatus = !post.LikeUserStatus; 
 
    post.LikeUsersCount = post.LikeUserStatus ? parseInt(post.LikeUsersCount)+1 :parseInt(post.LikeUsersCount)-1   
 
})`;

$ timeou t执行后运行摘要周期

+0

感谢您的回复。这是行不通的,我在手机上面临这个问题。当我打开移动设备时,代码按照预期的方式工作在屏幕上显示的列表项目中。当我向下滚动查看下一个列表项目时代码无法工作。 – Avinash

+0

好吧,然后我没有解决方案,将不得不深入了解它 – AbhiGoel