將ID添加到角度模式表單的輸入字段？

我正在使用Angular Schema Form爲我生成輸入字段。我想知道是否有任何方法可以通過添加ID來自定義輸入字段。我試着查看文檔（https://github.com/Textalk/angular-schema-form/blob/development/docs/index.md），但似乎並不像當前版本支持它（僅添加類）。將ID添加到角度模式表單的輸入字段？

來源

2015-05-07 user3314402

我只是做了一些調查，對「廚房水槽」例如在 -

http://schemaform.io/examples/bootstrap-example.html

他們已經使用這個代碼

形式：

`[ 
    { 
    "type": "fieldset", 
    "title": "Stuff", 
    "items": [ 
     { 
     "type": "tabs", 
     "tabs": [ 
      { 
      "title": "Simple stuff", 
      "items": [ 
       { 
       "key": "name", 
       "placeholder": "Check the console", 
       "onChange": "log(modelValue)", 
       "feedback": "{'glyphicon': true, 'glyphicon-ok': hasSuccess(), 'glyphicon-star': !hasSuccess() }" 
       }, 
       { 
       "key": "favorite", 
       "feedback": false 
       } 
      ] 
      }, 
      { 
      "title": "More stuff", 
      "items": [ 
       "attributes.eyecolor", 
       "attributes.haircolor", 
       { 
       "key": "attributes.shoulders.left", 
       "title": "Left shoulder", 
       "description": "This value is copied to attributes.shoulders.right in the model", 
       "copyValueTo": [ 
        "attributes.shoulders.right" 
       ] 
       }, 
       { 
       "key": "shoesizeLeft", 
       "feedback": false, 
       "copyValueTo": [ 
        "shoesizeRight" 
       ] 
       }, 
       { 
       "key": "shoesizeRight" 
       }, 
       { 
       "key": "invitation", 
       "tinymceOptions": { 
        "toolbar": [ 
        "undo redo| styleselect | bold italic | link image", 
        "alignleft aligncenter alignright" 
        ] 
       } 
       }, 
       "things", 
       "dislike" 
      ] 
      } 
     ] 
     } 
    ] 
    }, 
    { 
    "type": "help", 
    "helpvalue": "<hr>" 
    }, 
    "soul", 
    { 
    "type": "conditional", 
    "condition": "modelData.soul", 
    "items": [ 
     { 
     "key": "soulserial", 
     "placeholder": "ex. 666" 
     } 
    ] 
    }, 
    { 
    "key": "date", 
    "minDate": "2014-06-20" 
    }, 
    { 
    "key": "radio", 
    "type": "radios", 
    "titleMap": [ 
     { 
     "value": "Transistor", 
     "name": "Transistor <br> Not the tube kind." 
     }, 
     { 
     "value": "Tube", 
     "name": "Tube <br> The tube kind." 
     } 
    ] 
    }, 
    { 
    "key": "radio2", 
    "type": "radios-inline", 
    "titleMap": [ 
     { 
     "value": "Transistor", 
     "name": "Transistor <br> Not the tube kind." 
     }, 
     { 
     "value": "Tube", 
     "name": "Tube <br> The tube kind." 
     } 
    ] 
    }, 
    { 
    "key": "radiobuttons", 
    "style": { 
     "selected": "btn-success", 
     "unselected": "btn-default" 
    }, 
    "type": "radiobuttons", 
    "notitle": true 
    }, 
    { 
    "type": "actions", 
    "items": [ 
     { 
     "type": "submit", 
     "style": "btn-info", 
     "title": "Do It!" 
     }, 
     { 
     "type": "button", 
     "style": "btn-danger", 
     "title": "Noooooooooooo", 
     "onClick": "sayNo()" 
     } 
    ] 
    } 
]`

架構：

`{ 
    "type": "object", 
    "required": [ 
    "name", 
    "shoesizeLeft" 
    ], 
    "properties": { 
    "name": { 
     "title": "Name", 
     "description": "Gimme yea name lad", 
     "type": "string", 
     "pattern": "^[^/]*$", 
     "minLength": 2 
    }, 
    "invitation": { 
     "type": "string", 
     "format": "html", 
     "title": "Invitation Design", 
     "description": "Design the invitation in full technicolor HTML" 
    }, 
    "favorite": { 
     "title": "Favorite", 
     "type": "string", 
     "enum": [ 
     "undefined", 
     "null", 
     "NaN" 
     ] 
    }, 
    "shoesizeLeft": { 
     "title": "Shoe size (left)", 
     "default": 42, 
     "type": "number" 
    }, 
    "shoesizeRight": { 
     "title": "Shoe size (right)", 
     "default": 42, 
     "type": "number" 
    }, 
    "attributes": { 
     "type": "object", 
     "title": "Attributes", 
     "required": [ 
     "eyecolor" 
     ], 
     "properties": { 
     "eyecolor": { 
      "type": "string", 
      "format": "color", 
      "title": "Eye color", 
      "default": "pink" 
     }, 
     "haircolor": { 
      "type": "string", 
      "title": "Hair color" 
     }, 
     "shoulders": { 
      "type": "object", 
      "title": "Shoulders", 
      "properties": { 
      "left": { 
       "type": "string", 
       "title": "Left" 
      }, 
      "right": { 
       "type": "string", 
       "title": "Right" 
      } 
      } 
     } 
     } 
    }, 
    "things": { 
     "type": "array", 
     "title": "I like...", 
     "items": { 
     "type": "string", 
     "enum": [ 
      "clowns", 
      "compiling", 
      "sleeping" 
     ] 
     } 
    }, 
    "dislike": { 
     "type": "array", 
     "title": "I dislike...", 
     "items": { 
     "type": "string", 
     "title": "I hate" 
     } 
    }, 
    "soul": { 
     "title": "Terms Of Service", 
     "description": "I agree to sell my undying <a href='https://www.youtube.com/watch?v=dQw4w9WgXcQ'>soul</a>", 
     "type": "boolean", 
     "default": true 
    }, 
    "soulserial": { 
     "title": "Soul Serial No", 
     "type": "string" 
    }, 
    "date": { 
     "title": "Date of party", 
     "type": "string", 
     "format": "date" 
    }, 
    "radio": { 
     "title": "Radio type", 
     "type": "string", 
     "enum": [ 
     "Transistor", 
     "Tube" 
     ] 
    }, 
    "radio2": { 
     "title": "My Second Radio", 
     "type": "string", 
     "enum": [ 
     "Transistor", 
     "Tube" 
     ] 
    }, 
    "radiobuttons": { 
     "type": "string", 
     "enum": [ 
     "Select me!", 
     "No me!" 
     ] 
    } 
    } 
}`

從乍一看，它似乎在第一個輸入字段上生成一個ID。所以我認爲它與表格中的Key和模式中的title有關。

來源

2015-05-07 15:51:48 Benjamin

ID字段是從舊的0.x版本的密鑰的最後一個段生成的，並且在下一個版本代碼中爲1.0.0及更高版本組合了表單名稱和對象路徑。

所以從1.0.0起，你將有類似正確的唯一的ID：

formName--objectName-arrayName-4-property

雖然類匹配，也將是一個版本一起使用，而不陣列的位置：formName--objectName-arrayName-property

的獨特的ID和靈活的類的組合應該滿足任何定製需求。

來源

2017-07-18 04:43:08 Anthropic

將ID添加到角度模式表單的輸入字段？

回答

相關問題