ICode9

精准搜索请尝试: 精确搜索
首页 > 编程语言> 文章详细

javascript – RIVETS.JS – 在html image src中解析占位符的正确语法是什么?

2019-07-18 01:39:23  阅读:230  来源: 互联网

标签:javascript jquery-mobile html rivets-js


我创建了以下页面:

<div id="mypage" data-role="page" data-theme="w">
<div id="header" data-role="header" class="ui-noboxshadow ui-header-fixed" data-position="fixed">

</div>
<div data-role="content">       
    <p class="detail-row" style="margin-top: 1em;"><span class="detail-value">{mypage.currentDate}</span></p>
    <p class="detail-row" style="margin-top: 1em;"><span class="detail-value"><img id="myimage_id" src="{mypage.myimage}" /></span></p>
    <p class="detail-row" style="margin-top: 1em;"><span class="detail-value">{mypage.mytitle}</span></p>
    <p class="detail-row"><span class="detail-value">{mypage.mydescription}</span></p>
</div>
<div id="footer" data-role="footer" data-position="fixed" data-theme="g" class="ui-noboxshadow" data-tap-toggle="false">
</div>

它运行良好(mypage.currentDate,mypage.mytitle,mypage.mydescription占位符已正确解析),除了mypage.image占位符:它未解析(我获取此url:/ {mypage.myimage})

调试javascript我看到mypage.myimage在模型中包含正确的值,那么为了解决img src属性中的路径,当前的语法是什么?

例:

如果我尝试写:{mypage.myimage}它正确翻译在/contextroot/images/image.jpg

如果我写它,则转换为< img src =“/ {mypage.myimage}”/>

它没有翻译,变量没有解决!

解决方法:

您需要为src属性编写一个binder:

rivets.binders.src = function(el, value) {
  el.src = value;
};

然后使用它你写:

<img rv-src="mypage.myimage" />

UDPATE:看看文档,我认为你甚至不需要定义绑定器.它应该默认在rv-之后设置属性名称

标签:javascript,jquery-mobile,html,rivets-js
来源: https://codeday.me/bug/20190718/1491677.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有