2017-03-06 20 views
0

私は以下のようなサンプルテンプレートを用意しています。これを解決するにはどうすればいいですか、私は学校、babydet.name、dept、babydet.section.secnameをjsonオブジェクト値に置き換えます。動的文字列テンプレート変数をjsonオブジェクトに置き換えます。

var Template1 = 'Welcome to the {{school}} baby {{babydet.name}}' 
var Template2 = 'Welcome to the school {{school}} department {{dept}} babydetails {{babydet.name}} {{babydet.section.secname}}' 

const namelist1= [{school:'GOVSchool',babydet: { name: 'shanker' }}]; 
const namelist2= [{school:'GOVSchool',dept:'CS',babydet: { name: 'shanker',section:{sectname:'A Section'}}}]; 

文字列置換の助けを借りてこれを達成する必要があります(単一ロジック)。 "世界のベビーシャンカーへようこそ"

+1

JSONはデータ交換のための*テキスト表記*です。 [(もっと)](http://stackoverflow.com/a/2904181/157247)JavaScriptのソースコードを扱い、*文字列*を扱っていない場合は、JSONを扱っていません。それらはただの目的です。 –

答えて

2

もしlodash.jsが利用可能な場合は、_.template関数を使用することができます。詳細はhereです。あなたが潜在的にあなたの文字列を補間するES6 Template literalsを使用することができ

var Template1 = 'Welcome to the {{school}} baby {{babydet.name}}' 
 
var Template2 = 'Welcome to the school {{school}} department {{dept}} babydetails {{babydet.name}} {{babydet.section.secname}}' 
 

 
var namelist1= [{school:'GOVSchool',babydet: { name: 'shanker' }}]; 
 
var namelist2= [{school:'GOVSchool',dept:'CS',babydet: { name: 'shanker',section:{sectname:'A Section'}}}]; 
 

 
_.templateSettings.interpolate = /{{([\s\S]+?)}}/g; 
 
var interpolator = _.template(Template1); 
 
var interpolated = interpolator(namelist2[0]); 
 

 
console.log(interpolated) 
 

 
interpolator = _.template(Template2); 
 
interpolated = interpolator(namelist2[0]); 
 

 
console.log(interpolated)
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.4/lodash.min.js"></script>

0

namelist varsは、JSONデータから解析されたオブジェクトのスタンドインであり、その構造を知っています。また、その構造を知っています。そして、あなたの質問に答えるために、いくつかの基本的な前提を設定します(この例ではハードコードします)。このソリューションを現実世界に役立てるために、データ配列を反復処理する方法を知っています。

テンプレートリテラルではなく、引用符のバッククォート「`」で囲まれている、とあなたは${/* reference variable */}

const namelist1= [{school:'GOVSchool',babydet: { name: 'shanker' }}]; 
const namelist2= [{school:'GOVSchool',dept:'CS',babydet: { name: 'shanker',section:{sectname:'A Section'}}}]; 

let Template1 = `Welcome to the ${namelist1[0].school} baby ${namelist1[0].babydet.name}`; 
let Template2 = `Welcome to the school ${namelist2[0].school} department ${namelist2[0].dept} babydetails ${namelist2[0].babydet.name} ${namelist2[0].babydet.section.sectname}`; 
0

似たようなことをしていましたが、唯一の違いはJSONオブジェクトにネストされたプロパティがないことです。

私は単純なアプローチを使用しています(うまくいけばあまり単純すぎません)。 HTMLテンプレートに代入される任意の数のプロパティを受け入れることができます。私はなるだろう

let data = { text: 'My Text', description: 'my description' }; 

<div><span>My Text</span><span>my description</span></div> 

はここJSBinでの実装を参照してください:https://jsbin.com/zelogof/7/edit?js,console

はして

let template = 
    '<div><span>{{ text }}</span><span>{{description}}</span></div>'; 

そして、いくつかのデータ:

は、テンプレートを考えます提案も大歓迎です!

関連する問題