用ActionController::Renderer的render方法渲染模版
使用Cable进行pub:
ActionCable.server.broadcast "call", {address: AddressesController.render(@address)}
其中:AddressesController.render,是一个类方法,用于渲染view/addresses/_addresses.html.erb模版,并传入一个实例变量address。
# view/addresses/_addresses.html.erb
<td><%= address.name %></td>
<td><%= address.count %></td>
然后App收到数据,把数据添加到DOM上。
App.calladdress = App.cable.subscriptions.create "CalladdressChannel",
received: (data) ->
console.log(data)
para = document.createElement('tr')
para.innerHTML = data.address
if document.getElementById("add") != null
document.getElementById("add").appendChild(para)
else
console.log("null")
分析:
1. 注意data是一个hash对象。我们要用data.address提取出字符串格式的元素DOM.
2. 创建一个<tr>, 然后把字符串数据存入。
3. 附加到#add元素内。
render(*args)
Render templates with any options from ActionController::Base#render_to_string.
render_to_string(*args)
渲染一个模版,返回一个string格式。
例子,可以使用任何参数:
FooController.render :action, locals: { ... }, assigns: { ... }
用ActionController::Renderer的render方法渲染模版的更多相关文章
- 010 vue使用render方法渲染组件
1.普通的组件渲染方式 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&qu ...
- render方法渲染组件和在webpack中导入vue
使用component注册的组件div容器里可以放多个,但是使用render的只能放一个 <div id="app"> <p>我可以放两个</p> ...
- 实例的render方法渲染组件
1.普通渲染组件 在app容器中插入login组件 <login></login> 一个app可以多个这种组件 <script> var login = { te ...
- 19 使用Vue实例的render方法渲染组件
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- Django——2 路由分配设置 re_path正则匹配 include总路由 url传参 name使用 模板渲染render方法 模板渲染方法
Django 路由分配设置 re_path正则匹配 include总路由设置 url额外参数的传递 name的使用 模板的渲染:render方法 路由的分配中, 可以设定相应的转换器加以约束,比如 ...
- render 函数渲染表格的当前数据列使用
columns7: [ { title: '编号', align: 'center', width: 90, key: 'No', render: (h, params) => { return ...
- React.js 小书 Lesson7 - 组件的 render 方法
作者:胡子大哈 原文链接:http://huziketang.com/books/react/lesson7 转载请注明出处,保留原文链接和作者信息. React.js 中一切皆组件,用 React. ...
- Flask06 地址约定、利用falsk提供的方法渲染模板
1 访问地址约定 在访问路径的末尾是否需要加 / -> 可以加,也可以不加 前端的访问路径必须和后端的路径完全匹配才能够访问成功,如果我们在后台的路径都是以 / 结尾,但是我们的访问路径是没有以 ...
- 组件的 render 方法
React.js 中一切皆组件,用 React.js 写的其实就是 React.js 组件.我们在编写 React.js 组件的时候,一般都需要继承 React.js 的 Component(还有别的 ...
随机推荐
- 一道cf水题
题意:输入数字n表示字符串中元素个数,字符串中只含有RGB三个字符,现在要求任意两个相同的字符他们的下标之差能整除3. 思路:任意两个相同的字符的下标能整除3,也就是任意三个为一组的字符串当中的字符不 ...
- Spring 学习——Spring常用注解——@Component、@Scope、@Repository、@Service、@Controller、@Required、@Autowired、@Qualifier、@Configuration、@ImportResource、@Value
Bean管理注解实现 Classpath扫描与组件管理 类的自动检测与注册Bean 类的注解@Component.@Service等作用是将这个实例自动装配到Bean容器中管理 而类似于@Autowi ...
- mysql 的delete from 和update子查询限制
最经做项目时发现的问题,好像在update时也有... 网上查到的资料如下: 1.使用mysql进行delete from操作时,若子查询的 FROM 字句和更新/删除对象使用同一张表,会出现错误. ...
- Bootstrap3基础 input-group-btn 按钮与输入框 横向组合
内容 参数 OS Windows 10 x64 browser Firefox 65.0.2 framework Bootstrap 3.3.7 editor ...
- vue学习【第三篇】:vue之node.js的简单介绍
什么是node.js 它是可以运行JavaScript的服务平台,可以吧它当做一门后端程序,只是它的开发语言是JavaScript 安装node.js node.js的特性 - 非阻塞IO模型 - 时 ...
- x盒子
0换成1切回
- 远程调试Spring项目
目录 服务端启动: 启动jar包: 使用环境变量参数调试jar包: 使用mvnDebug启动SpringMVC项目: 使用mvn启动: 使用Tomcat,非嵌入式启动: 客户端设置: IDEA设置: ...
- 算法总结(转自CS-Notes)
转载地址: 注意要点: 1.希尔排序:实际是将元素按步距h分为几组,每组元素没有关系,是组里每个元素跨步距h得到的一组元素是有序的,那么剩下的问题就是组内有序,再处理好组间边界即可.实际解决的方式是不 ...
- 深度学习课程笔记(五)Ensemble
深度学习课程笔记(五)Ensemble 2017.10.06 材料来自: 首先提到的是 Bagging 的方法: 我们可以利用这里的 Bagging 的方法,结合多个强分类器,来提升总的结果.例如: ...
- (转载)C# GDI+ 画简单的图形:直线、矩形、扇形等
GDI+是一种绘图装置接口, 当拖动窗体是,窗体发生移动,window默认为从窗体移动到另一个地方,先发生擦除后再重新画一个窗体: 而我们自己动手画的图(如下面的线),不会重新画:在属性中,Paint ...