javascript - Alpaca - 当模式对象是数组类型时，如何设置布局模板？

Question

有没有办法为架构内的数组列表对象设置 View 模板？

我找到了the Documentation关于布局，但它在我的情况下不起作用，因为我的架构仅包含一个内部有多个字段的对象数组。在页面加载时，我没有收到任何错误，并且我的羊驼对象包含我添加的模板，但其中没有记录。

var Schema = {
  "title": "Lista controlli",
  "type": "array",
  "items": {
    "type": "object",
    "title": "Controllo Lavorazione",
    "properties": {
      "Id": {
        "title": "Id",
        "type": "string"
      },
      "Tipo": {
        "title": "Tipo controllo",
        "type": "number",
        "required": true,
        "enum": [1, 2, 3, 4]
      },
      "Obbligatorio": {
        "required": true
      },
      "Nome": {
        "title": "Nome",
        "type": "string",
        "required": true
      },
      "Sigla": {
        "title": "Sigla",
        "type": "string",
        "required": true
      },
      "Posizione": {
        "title": "Posizione",
        "type": "number"
      },
      "Valore": {
        "title": "Valore",
        "type": "number",
        "required": true
      },
      "UM": {
        "title": "Unita Misura",
        "type": "string"
      },
      "TolleranzaMeno": {
        "title": "Tolleranza (-)",
        "type": "number",
        "required": true
      },
      "TolleranzaPiu": {
        "title": "Tolleranza (+)",
        "type": "number",
        "required": true
      },
      "Lettura": {
        "title": "Valore letto",
        "type": "string"
      }
    }
  }
}

var Lavorazioni_Options = {
  "type": "array",
  "toolbarSticky": true,
  "items": {
    "type": "object",
    "fields": {
      "Id": {
        "hidden": true
      },
      "Tipo": {
        "type": "select",
        "sort": function(a, b) {
          if (a.value > b.value) {
            return 1;
          } else if (a.value < b.value) {
            return -1;
          }
          return 0;
        },
        "noneLabel": "-- Seleziona --",
        "removeDefaultNone": false,
        "showMessages": false,
        "optionLabels": ["Numerico", "Testo", "Flag", "Nota"]
      },
      "Obbligatorio": {
        "rightLabel": "Controllo Obbligatorio",
        "type": "checkbox"
      },
      "Posizione": {
        "showMessages": false,
        "hidden": true
      },
      "Nome": {
        "showMessages": false
      },
      "Sigla": {
        "showMessages": false
      },
      "Valore": {
        "hidden": true
      },
      "TolleranzaPiu": {
        "hidden": true
      },
      "TolleranzaMeno": {
        "hidden": true
      },
      "UM": {
        "hidden": true
      },
      "Lettura": {
        "hidden": true
      }
    }
  },
  "focus": false,
  "helpers": [],
  "validate": true,
  "disabled": false,
  "showMessages": false,
  "legendStyle": "button",
  "hideInitValidationError": true
}

var LavorazioniEdit_Options = {
  "type": "array",
  "toolbarSticky": true,
  "items": {
    "type": "object",
    "fields": {
      "Id": {
        "disabled": true
      },
      "Tipo": {
        "type": "select",
        "sort": function(a, b) {
          if (a.value > b.value) {
            return 1;
          } else if (a.value < b.value) {
            return -1;
          }
          return 0;
        },
        "noneLabel": "-- Seleziona --",
        "removeDefaultNone": false,
        "showMessages": false,
        "optionLabels": ["Numerico", "Testo", "Flag", "Nota"]
      },
      "Obbligatorio": {
        "rightLabel": "Controllo Obbligatorio",
        "type": "checkbox"
      },
      "Posizione": {
        "showMessages": false,
        "hidden": true
      },
      "Nome": {
        "showMessages": false
      },
      "Sigla": {
        "showMessages": false
      },
      "Valore": {
        "hidden": true
      },
      "TolleranzaPiu": {
        "hidden": true
      },
      "TolleranzaMeno": {
        "hidden": true
      },
      "UM": {
        "hidden": true
      },
      "Lettura": {
        "hidden": true
      }
    }
  },
  "focus": false,
  "helpers": [],
  "validate": true,
  "disabled": false,
  "showMessages": false,
  "legendStyle": "button",
  "hideInitValidationError": true
}

var LavorazioniArticoli_Options = {
  "type": "array",
  "toolbarSticky": true,
  "items": {
    "type": "object",
    "fields": {
      "Id": {
        "hidden": true
      },
      "Tipo": {
        "type": "select",
        "disabled": true,
        "sort": function(a, b) {
          if (a.value > b.value) {
            return 1;
          } else if (a.value < b.value) {
            return -1;
          }
          return 0;
        },
        "noneLabel": "-- Seleziona --",
        "removeDefaultNone": false,
        "showMessages": false,
        "optionLabels": ["Numerico", "Testo", "Flag", "Nota"]
      },
      "Obbligatorio": {
        "rightLabel": "Controllo Obbligatorio",
        "disabled": true,
        "type": "checkbox"
      },
      "Posizione": {
        "showMessages": false,
        "hidden": true
      },
      "Nome": {
        "showMessages": false,
        "disabled": true
      },
      "Sigla": {
        "showMessages": false
      },
      "Valore": {
        "multipleOf": 0.01,
        "showMessages": false
      },
      "TolleranzaPiu": {
        "multipleOf": 0.01,
        "showMessages": false
      },
      "TolleranzaMeno": {
        "multipleOf": 0.01,
        "showMessages": false
      },
      "UM": {},
      "Lettura": {
        "hidden": true
      }
    }
  },
  "focus": false,
  "helpers": [],
  "validate": true,
  "disabled": false,
  "showMessages": false,
  "legendStyle": "button",
  "hideInitValidationError": true
}

var lavorazioniView = {
  "parent": "bootstrap-edit-horizontal",
  "layout": {
    "template": "<div class='row'><div class='col-md-6' id='column-1'></div><div class='col-md-6' id='column-2'></div></div>",
    "bindings": {
      "Id": "column-1",
      "Posizione": "column-2",
      "Tipo": "column-1",
      "Obbligatorio": "column-2",
      "Nome": "column-1",
      "Sigla": "column-2",
      "Valore": "column-1",
      "UM": "column-2",
      "TolleranzaMeno": "column-1",
      "TolleranzaPiu": "column-2",
      "Lettura": "column-1"
    }
  }
}

$(function() {
  $('#jsoneditor').alpaca({
    "schema": Schema,
    "options": Lavorazioni_Options,
    //"view": lavorazioniView
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/4.0.0/handlebars.js"></script>
<script src="https://code.cloudcms.com/alpaca/1.5.23/bootstrap/alpaca.min.js"></script>
<link href="https://code.cloudcms.com/alpaca/1.5.23/bootstrap/alpaca.min.css" rel="stylesheet" />

<div id="jsoneditor" class="jsoneditor-wrapper"></div>

提前致谢

Answer 1

目前看来这是不可能的。alpaca 存储库对此存在一个悬而未决的问题。

https://github.com/gitana/alpaca/issues/549

“布局绑定(bind)仅适用于顶级架构元素，不适用于子元素。”

很抱歉，如果这毁了你的一天(就像我的一样)。