json-formatter, 在HTML中,用于可折叠JSON的Angular 指令

分享于 

3分钟阅读

GitHub

  繁體 雙語
Angular directive for collapsible JSON in HTML
  • 源代码名称:json-formatter
  • 源代码网址:http://www.github.com/mohsen1/json-formatter
  • json-formatter源代码文档
  • json-formatter源代码下载
  • Git URL:
    git://www.github.com/mohsen1/json-formatter.git
    Git Clone代码到本地:
    git clone http://www.github.com/mohsen1/json-formatter
    Subversion代码到本地:
    $ svn co --depth empty http://www.github.com/mohsen1/json-formatter
    Checked out revision 1.
    $ cd repo
    $ svn up trunk
    
    JSON格式化程序

    Build StatusCode Climate

    JSON格式化程序是一个AngularJS指令,用于用的可折叠导航来呈现JSON对象。

    Screebshot

    现在,在纯JavaScript中还提供了 ,它依赖零 !

    用法

    • 通过 Bower 或者npm安装

      bower install json-formatter --save

      。或者

      npm install jsonformatter --save
    • jsonFormatter 添加到应用程序依赖项

      angular.module('MyApp', ['jsonFormatter'])
    • 使用 <json-formatter> 指令

      <json-formatterjson="{my: 'json'}"open="1"></json-formatter>
    • open 属性接受一个数字,该数字指示呈现JSON应打开多少个级别

    配置

    你可以使用 JSONFormatterConfig 提供程序配置JOSN格式化程序。

    可用配置

    悬停预览
    • hoverPreviewEnabled: 在悬停时启用预览
    • hoverPreviewArrayCount: 在预览中显示大于这个数字的array 项数量将显示为 Array[XXX],其中 XXX 是的长度。
    • hoverPreviewFieldCount: 对象预览要显示的对象属性的数目。 任何具有较多属性的对象都将被截断。

    使用配置的示例

    app.config(function (JSONFormatterConfigProvider) {
     // Enable the hover preview featureJSONFormatterConfigProvider.hoverPreviewEnabled=true;
    });

    演示

    请参见这里的示例。

    已知的Bug

    hashKey

    如果使用 ng-repeat 迭代对象的array,请确保使用 track by $index 来避免对对象添加额外的$$hashKey

    浏览器支持

    支持所有现代浏览器。 支持的最低版本 IE 为。

    许可证

    Apache 2.0

    请参见许可协议。


    相关文章