无法在Jasonette模板中设置班级名称

时间:2018-11-07 15:09:39

标签: css jasonette

我有一个Jasonette“应用程序”,可以从服务器获取一个简单的数据集并将其显示在列表中。数据是一组人员名称,每个人员名称都带有单词“ YES”,“ NO”,“ MAYBE”或null:

{
    "date":"2018-11-07",
    "dateFormatted":"Wednesday, November 7th",
    "responses":[
        {"name":"Jonathan","response":"NO"},
        {"name":"Mark","response":"YES"},
        {"name":"Stuart","response":"YES"},
        {"name":"Jack","response":"MAYBE"},
        {"name":"David","response":null}
    ]
}

这是该应用的代码,是从其中一个示例应用程序复制而来的:

{
  "@": "http://web.jasonette.com/items/926",
  "title": "OSTT Mincha",
  "collection": {
    "@": "responses@https://example.com/status.json"
  },
  "adapter": {
    "title": "{{name}}",
    "description": "{{response}}"
  },
  "style": {
    "background": "#ffffff",
    "header": {
      "background": "#ffffff",
      "color": "#2a2a2a"
    },
    "item": {
      "title": "#bc9458",
      "description": "#001000"
    }
  }
}

现在,我要对响应行进行颜色编码,“是”为绿色,“否”为红色,“ MAYBE”为黄色。

我试图修改“ Basic ListView Mixin”示例,以添加将添加这些背景的类,如下所示:

{
  "$jason": {
    "head": {
      "title": "Basic ListView Mixin",
      "type": "mixin",
      "data": {
        "collection": {
          "@": "$document.collection"
        },
        "style": {
          "@": "$document.style"
        },
        "styles": {
          "YES": {
            "background": "#dff0d8"
          },
          "NO": {
            "background": "#f2dede"
          },
          "MAYBE": {
            "background": "#fcf8e3"
          }
        }
      },
      "templates": {
        "body": {
          "header": {
            "title": {
              "@": "$document.title"
            },
            "style": {
              "background": "{{style.header.background}}",
              "color": "{{style.header.color}}"
            }
          },
          "background": "{{style.background}}",
          "sections": [
            {
              "items": {
                "{{#each collection}}": {
                  "type": "horizontal",
                  "style": {
                    "padding": "10",
                    "spacing": "10"
                  },
                  "components": [
                    {
                      "type": "vertical",
                      "components": [
                        {
                          "type": "label",
                          "style": {
                            "font": "HelveticaNeue-Bold",
                            "size": "12",
                            "color": "{{$root.style.item.title}}"
                          },
                          "class": "{{$document.adapter.description}}",
                          "text": {
                            "@": "$document.adapter.title"
                          }
                        },
                        {
                          "type": "label",
                          "text": {
                            "@": "$document.adapter.description"
                          },
                          "style": {
                            "font": "Helvetica",
                            "size": "11",
                            "color": "{{$root.style.item.description}}"
                          },
                          "class": "{{$document.adapter.description}}"
                        }
                      ]
                    }
                  ]
                }
              }
            }
          ]
        }
      }
    }
  }
}

问题是在输出中,我看不到应用的类。相反,class的值是{{$document.adapter.description}}-原始模板值。

根据我对文档的阅读,应该允许模板值出现在此处。为什么不替换此模板值?

0 个答案:

没有答案