IONIC多条聊天记渲染完毕后滚动到底部解决方案

最近开发一个混合即时通讯项目，有这样一个场景，当用户已经有很多条聊天记录后，再次进入后，需要显示所有的记录，然后自动滚动到底部。

滚动到底部实现起来比较简单，$ionicScrollDelegate就可以实现，但是angular的ng-repeat渲染是需要一段时间的，也就是说们需要知道什么时候ng-repeat才会渲染完成，才能真正滚动到页面底部。

研究了一下找到了一个解决方案：

为了达到复用的目的，我们需要写一个direcitve，上代码：

'use strict';

// @ngInject
module.exports = function enterAction() {
  return {
      restrict: 'A',link: function (scope,element,attr) {
          if (scope.$last === true) {
              scope.$eval(attr.finishRender);
          }
      },};
};

上面的代码中scope.$last就是用来判断是否是最后一天记录被渲染，实话讲，angular为开发想到的语法糖真得是很多。

判断好最好一个后，需要通知一个事件，用到的就是$eval这个方法，其主要作用就是， 可计算某个字符串，并执行其中的的 JavaScript 代码。

那么如何使用呢：

<ion-list>
    <ion-item ng-repeat="msgItem in chat.messageList"    finish-render="finishRender()">

    </ion-item>
</ion-list>

之后，我么在control中声明一个finisheRender()的方法就会被调用了。

so easy!!!!!!

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!