angular-schem-form 表单类型扩展

开始配置

增加一个表单的扩展类型，需要最基本的一个template模板和一些builder functions，具体代码如下：

template：

<div class="form-group {{form.htmlClass}}" ng-class="{'has-error': hasError(),'has-success': hasSuccess()}">
    <label class="control-label {{form.labelHtmlClass}}" ng-show="showTitle()">{{form.title}}</label>
    <tags-input
            schema-validate="form"
            min-length="{{form.minLength}}"
            max-length="{{form.maxLength}}"
            min-tags="{{form.minTags}}"
            max-tags="{{form.maxTags}}"
            ng-model="$$value$$"
            name="{{form.key.slice(-1)[0]}}"
            placeholder="{{form.placeholder}}"
            class="{{form.fieldHtmlClass}}"></tags-input>
    <span class="help-block">{{ (hasError() && errorMessage(schemaError())) || form.description}}</span>
</div>

js：

angular.module('myAddOnModule',['schemaForm'])
  .config(function(schemaFormDecoratorsProvider, sfPathProvider, schemaFormProvider,) {
    var tagCloud = function (name, schema, options) {
        if (schema.type === 'array' && (schema.format === 'tagCloud')) {
            var f = schemaFormProvider.stdFormObj(name, schema, options);
            f.key = options.path;
            f.type = 'tagCloud';
            options.lookup[sfPathProvider.stringify(options.path)] = f;
            return f;
        }
    };
  
    schemaFormProvider.defaults.array.unshift(tagCloud);
  
    schemaFormDecoratorsProvider.addMapping(
        'bootstrapDecorator',
        'tagCloud',
        tagCloudTemplate
    );
  
    schemaFormDecoratorsProvider.createDirective(
        tagCloudTemplate
    );
});

以上是我在项目中使用的标签输入类型扩展，schema-validate="form"是必须的，它会对form组件上的model进行validate，如果没有写入该语句，最后生成的表单控件将不会具备表单验证。has-error、has-success、hasError()、hasSuccess()都是angular-schema-form中内置的表单验证成功的样式和调用方法，可以根据自己的需要进行使用。

ng-model是通过$$value$$进行绑定的，它直接绑定的是form配置的key的model。

自定义的可配置项都可以通过form.property进行定义，在使用schema form配置form文件时，可以在form中对property进行配置，形如：

var form = [
  {
     key: "name",
     minLength: 4
  }
]

如上面的代码示例，我在扩展类型中自定义了form的minLength属性，所以在使用时，可以通过在form中配置minLength进行使用。

<span class="help-block">{{ (hasError() && errorMessage(schemaError())) || form.description}}</span> 该段代码是用来对表单控件的描述和错误信息进行展示