使用另一个对象中的值搜索和替换一个对象中的标记

时间:2015-09-28 05:03:30

标签: javascript json templates

我有两个json文件加载到页面中。一个包含标签的名称和值。另一个json文件包含html。我被困了一天谷歌搜索并试图替换这些标签。

例如:

var tags = {
    title: "New Title",
    author: "John Doe"
};

var html = {
    header: "<div id=\"header\"><h1>{{title}}</h1</div>",
    content:  "<div id=\"content\"><h2>{{author}}</h2></div>"
};

我把它解除了,如果html存储在一个字符串中,我可以替换我的标签,但是当html在一个对象中时,我遇到了问题。

var str = 'The Title is {{title}} and the author is {{author}}.  Proof it will replace multiple tags:  Again the author is {{author}}.';

var content = str.replace(/\{\{(.*?)\}\}/g, function(i, match) {
    return tags[match];
});

我需要帮助迭代html对象中的所有值并用正确的标记值替换它们。感谢

1 个答案:

答案 0 :(得分:1)

您可以遍历html对象中的每个属性并替换其内容

var tags = {
  title: "New Title",
  author: "John Doe"
};

var html = {
  header: "<div id=\"header\"><h1>{{title}}</h1</div>",
  content: "<div id=\"content\"><h2>{{author}}</h2></div>"
};

for (var key in html) {
  if (html.hasOwnProperty(key)) {
    html[key] = html[key].replace(/\{\{(.*?)\}\}/g, function(i, match) {
      return tags[match];
    });
  }
}


content.innerText = JSON.stringify(html, null, 2)
<pre id="content"></pre>