2012-01-04 4 views
5

슈퍼 간단한 JavaScript 템플릿 솔루션을 만들려고합니다. JavaScript replace 메서드를 사용하여 템플릿에서 중괄호의 모든 인스턴스를 찾고 해당 데이터로 바꿉니다. 내 템플릿이 있다면찾기 및 바꾸기 JavaScript로 바꾸기

는 예를 들어, 다음은

<p>My name is Olly. I am 19.</p> 지금까지 내 코드입니다 : http://jsfiddle.net/2RkAG/

나는 그것이 자동으로 각각의 조각을 대체하기 위해 노력하고있어 <p>My name is {{name}}. I am {{age}}.</p>

나는 결과를 원하는 것 데이터가 없으므로 JavaScript 대신 명시 적으로 JavaScript에 알릴 필요가 없습니다. 그러나 이것은 내가 문제가있는 곳입니다.

답변

4

$1 문자열을 직접 전달하는 경우에만 작동합니다. 문자열이 .replace - 및 person["$1"]으로 전달되기 전에 person["$1"]이 평가되므로 문자 그대로 undefined이므로이 방법으로는 작동하지 않습니다.

대신 함수를 전달할 수 있습니다 : http://jsfiddle.net/2RkAG/1/. 이 함수는 각 대체에 대해 호출되며 인수가 전달됩니다. $1.

$result.html(template.replace(/{{(.*?)}}/g, function(a, b) { 
    return person[b]; // a = complete match, b = first group 
})); 

첫 번째 {도 이스케이프 처리 할 필요가 없습니다.

+0

고마워요. 저건 완벽 해. –

+0

템플릿을 다음과 같이 사용하려면 어떻게해야합니까? '

내 이름은 {{person.name}}입니다. 나는 {{person.age}}이다.

'. 나는 이것을'eval'과 함께 사용하게되었지만, 이것을하기위한 최선의 방법인가? 안전한? 마찬가지로 : http://jsfiddle.net/2RkAG/20/ –

+1

@Oliver Joseph Ash : 'eval'을 원하지 않으면 알고리즘을 찾는 경로가 필요합니다. http://jsfiddle.net/2RkAG/24 . – pimvdb