使用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方法渲染模版的更多相关文章

  1. 010 vue使用render方法渲染组件

    1.普通的组件渲染方式 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&qu ...

  2. render方法渲染组件和在webpack中导入vue

    使用component注册的组件div容器里可以放多个,但是使用render的只能放一个 <div id="app"> <p>我可以放两个</p> ...

  3. 实例的render方法渲染组件

    1.普通渲染组件 在app容器中插入login组件 <login></login>  一个app可以多个这种组件 <script> var login = { te ...

  4. 19 使用Vue实例的render方法渲染组件

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. Django——2 路由分配设置 re_path正则匹配 include总路由 url传参 name使用 模板渲染render方法 模板渲染方法

    Django 路由分配设置 re_path正则匹配 include总路由设置 url额外参数的传递 name的使用 模板的渲染:render方法   路由的分配中, 可以设定相应的转换器加以约束,比如 ...

  6. render 函数渲染表格的当前数据列使用

    columns7: [ { title: '编号', align: 'center', width: 90, key: 'No', render: (h, params) => { return ...

  7. React.js 小书 Lesson7 - 组件的 render 方法

    作者:胡子大哈 原文链接:http://huziketang.com/books/react/lesson7 转载请注明出处,保留原文链接和作者信息. React.js 中一切皆组件,用 React. ...

  8. Flask06 地址约定、利用falsk提供的方法渲染模板

    1 访问地址约定 在访问路径的末尾是否需要加 / -> 可以加,也可以不加 前端的访问路径必须和后端的路径完全匹配才能够访问成功,如果我们在后台的路径都是以 / 结尾,但是我们的访问路径是没有以 ...

  9. 组件的 render 方法

    React.js 中一切皆组件,用 React.js 写的其实就是 React.js 组件.我们在编写 React.js 组件的时候,一般都需要继承 React.js 的 Component(还有别的 ...

随机推荐

  1. 【转】java提高篇之理解java的三大特性——多态

    面向对象编程有三大特性:封装.继承.多态. 封装隐藏了类的内部实现机制,可以在不影响使用的情况下改变类的内部结构,同时也保护了数据.对外界而已它的内部细节是隐藏的,暴露给外界的只是它的访问方法. 继承 ...

  2. python --- 19 判断对象所属,区分函数和对象, 反射

    一.判断对象所属 isinstance, type , issubclass 1.issubclass(x,y)    判断x是否是y 的子类 2.type(x)  精准返回x 的数据类型 3.isi ...

  3. ODAC(V9.5.15) 学习笔记(四)TOraDataSet

    名称 类型 说明 SequenceMode TSequenceMode ODAC可以直接利用Oracle中的序列对象为表的主键赋值,从而实现主键自动增长的功能.该属性决定了在什么场合下使用序列: sm ...

  4. Python3基础 dict get 在查询不存在的键时,返回指定的内容

             Python : 3.7.0          OS : Ubuntu 18.04.1 LTS         IDE : PyCharm 2018.2.4       Conda ...

  5. html 之 td valign 和 align

    1.align属性趋向于左右对齐,其值包含:left.right.center 2.valign属性趋向于垂直对齐,其值包含:top.bottom.middle.baseline 兼容性 在 HTML ...

  6. Shiro学习笔记五(Shiro标签,及通配符)

    1.首先是导入标签库 <%@taglib prefix="shiro" uri="http://shiro.apache.org/tags" %> ...

  7. Docker Engine SDKs and API 的开发2

    Examples using the Docker Engine SDKs and Docker API After you install Docker, you can install the G ...

  8. Python有趣现象(不定时更新)

    1.list中extend方法有趣现象 1.1 List+=Str 与 List.extend(Str) list1 = [11,2,45] str1 = 'Michael' list1.extend ...

  9. BZOJ 4808: 马(二分图最大点独立集)

    http://www.lydsy.com/JudgeOnline/problem.php?id=4808 题意: 思路: 这图中的两个马只能选一个,二选一,很像二分图吧,对能互吃的两个棋子连线,在所选 ...

  10. 解决Geoserver请求跨域的几种思路,第二种思路用过

    文章版权由作者李晓晖和博客园共有,若转载请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/ 1.背景描述 跨域问题是浏览器同源安全制引起的特别常见的问题.不同前端语 ...