Angular中的Gmail样式标签
Gmail Style Tabs in Angular
是angular的新手,我只是希望能得到一些关于我可以在jQuery中相对快速实现的东西的指导。
作为一个宠物项目,我想出了一个漫画组织者网络应用程序来学习angular。我在jQuery中开始这个项目,看起来像这样…
<div id='main'>
<div id='library'>
</div>
<div id='series' data-currently-loaded-series='1234'>
</div>
<div id='comic' data-currently-loaded-comic='4321'>
</div>
</div>
现在我基于这个设计的gmail是如何工作的,它不会破坏标签,它只是隐藏它们,或缓存它们,所以你永远不会加载相同的信息两次。
点击库中的一个系列将其加载到系列div中。如果'当前加载的系列id'与我试图加载的系列id匹配它将不会加载任何内容,因为它看到它已经加载了,以此类推…
我觉得这种设计对我的小项目来说是无价的,因为很多漫画封面图像都是高分辨率的,在视图之间导航有点毫无意义,我当然知道图像通常是由浏览器缓存的,但当我可以简单地隐藏它们时,我仍然找不到破坏div的理由。我想我是在尽量减少数据请求。
我在互联网上看到过一些类似标签的例子,但gmail是我能找到的唯一一个没有破坏以前的视图/标签导航的例子。
输入角……
我发现,当在局部和视图之间切换时,它会破坏旧数据,我不太确定这种行为是否可以禁用。我想我可以设置与之前相同的div布局,只需加载多个视图并切换,但Angular不能很好地处理多个视图(显然UI-Router可能是这里的解决方案)。即使在一个视图中做这一切也不理想,因为我不太确定我是否能够使用URL路由…
我想我的终极问题是有人知道这个标签缓存机制gmail使用的名称吗?如果没有,有没有人能告诉我如何去创造类似的东西?
谢谢
我建议你在angular中使用bootstrap和Ui bootstrap。简单教程:http://odetocode.com/blogs/scott/archive/2013/08/14/dynamic-tabs-with-angularjs-and-ui-bootstrap.aspx
- Ionic V1.3-标签-带条件的徽章样式<离子选项卡>
- 如何防止 TinyMCE 将 CDATA 添加到<脚本>标签中,并注释掉<样式>标签
- 使用父标签中的样式属性附加新标签
- 基于Blob的'链接样式表'与标准'style'标签
- 如何更改表单的样式's字段标签
- Highcharts--Can't将样式应用于x轴标签
- 如何单独对输入标签应用样式
- 有没有办法从 Javascript 中的函数中调用脚本标签和样式标签
- 更改火狐输入文件标签中的光标样式
- 是否有可能在具有内联样式的样式标签上使用XSS进行攻击
- 使用 javascript 删除所有 html 标签中的背景样式
- 使用Javascript为输入字段添加边框样式颜色(提交时没有值),该字段已经在css中带有!important标签的边
- 如何获取html标签的计算样式值,然后将值设置为“样式”
- 如何从标签中删除样式属性
- 高图表仪表:标签半径样式
- IE10+中带深化的高图表不显示带下划线的标签样式
- 如何使用jQuery切换标签样式
- 获取正文标签样式属性内容
- onSubmit验证更改标签样式
- Highcharts:在CSS文件中编辑数据标签样式