瞎扯淡 ruby china SPA by angular js

suffering · 发布于 2014年05月26日 · 最后由 hxtheone 回复于 2014年05月29日 · 2084 次阅读
709

闲着无聊使用anuglarjs 做的ruby-china.org的 SPA 应用.

当前只有远程看帖, 发帖, 回帖的功能, 界面也是随便弄的一个, 上图片:

功能上有点鸡肋, 希望有一天能被采用, 到时rubychina能切换多主题, 甚至自定义界面 : )

changelog

5月29

新增 创建贴子或添加评论时的markdown内容实时预览, 支持emoji. 上图片:

共收到 8 条回复
709

此评论来自SPA端~~, 测试, 兼自占沙发.

9593

:plus1: 求个测评 link

De6df3

部属一个看看效果呀

709

@huacnlee, @special不行呢, 现在代码太丑陋了. 比如说POST硬编码TOKEN之类的, CROS之类的问题也都还没解决. 所以啊, 先放在瞎扯淡分类里呢~~`

应该会在这周末上个DEMO链接, 再push到github上去.

709

新增 创建贴子或添加评论时的markdown内容实时预览, 支持emoji. 上图片:

8234

#5楼 @suffering 请问这种实时预览功能是用什么实现的

709

#6楼 @kidult , angularjs天生带这个功能. 具体如下:

<div class='col-md-6'>
    <select class='form-control' ng-init='topic.node_id = 1' ng-model='topic.node_id' ng-options="node.id as node.name group by node.section_name for node in nodes" prompt="选择分类"></select>
    <input class='form-control' ng-model='topic.title' name='title'  placeholder='在这里输入标题' required  ng-minlength=2 />
    <span class="text-warning" ng-show="topicForm.title.$error.required">
          * 不能为空</span><br>
    <textarea ng-init="topic.body = ''"  ng-model='topic.body' class='form-control' style='min-height: 200px;' ng-required ng-min-length='1' msd-elastic></textarea>
</div>
<div class='col-md-6'>
    <h4>{{topic.title}}</h4>
    <div btf-markdown="topic.body | emoji">
    </div>
</div>

左边的内容写入, 右边的会实时更新上去. 但是右边加上了一个directive (btf-markdown)和一个fitler (emoji).分别来自于angular-markdown-directiveemoji.

加上两条指令后会将markdown语法转换后显示. 这个在angularjs里相当简单.

96

太酷了~

需要 登录 后方可回复, 如果你还没有账号请点击这里 注册