[置顶] 一个能够快速把JSON数据格式化成漂亮网页的开源JavaScript库:angular-json-human

标签: AngularJSJSONGithub
738人阅读 评论(0) 收藏 举报
分类:

有的时候,我们在做快速原型的时候,我们需要把获取的JSON数据快速的格式化并在本地的网站上面显示;或者把JSON数据过于复杂,且没有一定的规律,但是我们想把JSON的数据格式以更加友好的方式显示出来;这个时候怎么办?经过在Github上的搜索,笔者发现了一个比较有意思的开源框架,刚好能满足我们的要求。

具体下载地址为:https://github.com/yaru22/angular-json-huma, 其支持JSON格式的字符串,也支持JSON格式的javascript对象;而且其是基于AngularJS的,可以和AngularJS无缝的集成起来;下面是其提供的一个Example,显示出来的界面。



具体用法也很简单,只需要引入下面的几个JavaScript文件和一个CSS文件。

  <script src="lodash.js"></script>
  <script src="angular.js"></script>
  <script src="angular-json-human.js"></script>
  <link href="angular-json-human.css" rel="stylesheet" />

代码需要做的就是把要显示的JSON格式的字符串或者对象绑定到一个angular-json-human框架自定义的json-human的标签属性里面。

如下面所示意:

 <div json-human="jsonStr"></div>

简单吧。而且效果是杠杠的。

需要注意的是,如果是JSON格式的字符串,最好能把其中的双引号的JSON个格式数据替换成为单引号的字符串数据格式,否则显示的时候,可能会有一点不正常。但是并不影响快速原型环境中的使用。





1
0

查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:385908次
    • 积分:6347
    • 等级:
    • 排名:第4081名
    • 原创:228篇
    • 转载:0篇
    • 译文:5篇
    • 评论:157条
    博客专栏