Question

假设我有一个嵌套数组到未知深度的json对象。我想将每个数组提供给_.template函数。例如，我的json对象可能如下所示：

$start_elements = array (
        array(
            "elementTag"=>"li",
            "elementClass"=>"dashboard",
            "elementContent"=>array(
                "elementTag"=>"a",
                "elementContent"=>"Dashboard",
                "href"=>"#home"
                ) 
        ),
        array(
            "elementTag"=>"li", 
            "elementClass"=>"count indicator", 
            "elementContent"=>array(
                array(
                    "elementTag"=>"span", 
                    "elementClass"=>"data-count='8'", 
                    "elementContent"=>"Notifications"
                ), 
                array(
                    "elementTag"=>"ul", 
                    "elementClass"=>" ",
                    "elementContent"=>array(
                        "elementTag"=>"li", 
                        "elementContent"=>array(
                            "elementTag"=>"a",
                            "href"=>"#", 
                            "elementExtra"=>"data-modal",
                            "elementContent"=>array(
                                array(
                                    "elementTag"=>"h4",
                                    "elementContent"=>"Lorem Ipsum"
                                    ), 
                                array(
                                    "elementTag"=>"<p>",
                                    "elementContent"=>"Lorem ipsum dolor sit imet smd ddm lksdm lkdsm"
                                )
                            )
                        )
                    )
                )
            )
        )
);
json_encode($start_elements);

。

_模板：

_.template('<<%= elementTag %> class="<%= elementClass %>" href="<%= href %>"><%= elementContent %></<%= elementTag %>')

数组的嵌套结构很重要，因为我想在同一嵌套结构中输出html。例如，上面的对象将输出一个li对象，其中包含一个锚标记。如何在保留此结构的同时将模板应用于每个嵌套数组？

Answer 1

我会在您的模板周围创建一个包装函数，以使您的模板无逻辑。然后，您可以使用下划线的实用程序方法来检查您手中是否有数组，对象（或字符串）（_.isArray和_.isObject）。

您需要将包装函数传入模板，以便使用它。您只需_.extend {tmpl: tmpl}即可var data = { elementTag: "li", elementContent: [{ elementTag: "a", elementContent: "Dashboard" }, { elementTag: "div", elementContent: "Hello" }] }; var tmpl = _.template('<<%= elementTag %>><%= template(elementContent) %></<%= elementTag %>>'); function template(elData) { var html = ""; if (_.isArray(elData)) { _.each(elData, function (el) { html += template(el); }); } else if (_.isObject(elData)) { html = tmpl(_.extend({ template: template }, elData)); } else { html = elData; } return html; } console.log(template(data));数据。{/ p>

这是一个有效但简化的例子：

{{1}}

Answer 2

您可以执行以下操作：

function applyTemplate(obj){
  if _.has(obj, "elementContent"){
     obj.elementContent = applyTemplate(obj.elementContent)
  }
  return _.template("templateString", obj)
}

基本上，您浏览整个树并将elementContent替换为其模板值从下到上。

带有下划线和主干的JSON对象树递归

2 个答案: