我正在观看 YouTube 视频作者:Steve Bazyl 关于驱动器实时 API 的介绍。他提到使用实时和角度框架就像魔法一样。我已经开始研究它会是什么样子,但我还没有看到它的魔力。我很清楚,我可能不是这两个方面的专家,并且遗漏了一些小部分。
有人愿意启发我吗?我猜想有一种非常好的方法可以使内存中的数据模型自动神奇地连接到用户界面并与其他编辑和实际驱动文件同步。我很接近吗?
神奇可能有点夸张,但以下是我认为它们可以很好地配合的几个原因。
如果您花时间为模型声明类型,它们可以很好地与 Angular 的数据绑定配合使用,并且属性可以与 ng-model 一起使用。
-
更重要的是,由于 Angular 的工作方式,处理远程事件变得轻而易举。您真正需要的是一个事件侦听器:
doc.getModel().getRoot().addEventListener(
gapi.drive.realtime.EventType.OBJECT_CHANGED,
function(event) {
if (!event.isLocal) {
$rootScope.$digest();
}
});
这就是确保 UI 适当更新以响应远程事件所需要做的全部事情:)
有一些例外:
-
协作字符串很特殊。如果你不关心光标位置,你可以做一个简单的猴子补丁来将文本公开为与 ng-model 一起使用的标准属性。
Object.defineProperty(gapi.drive.realtime.CollaborativeString.prototype, 'text', {
set:function (value) {
return this.setText(value);
},
get:function () {
return this.getText();
}
});
然后,您可以绑定到协作字符串,例如:
<input type="text" data-ng-model="myCollaborativeString.text"/>
为了正确定位光标,编写可重用指令来做到这一点并不难。接下来的几周内,我将在 github 上开始收集有用的指令等,因此创建完全协作的文本字段就像添加属性一样简单:
<textarea data-rt-collaborative data-ng-model="myCollaborativeString"/>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)