車把模板源變化

由於某種原因（翻譯）我需要更改腳本中的一些文本，所以有什麼樣的選項來做到這一點與JavaScript？所以，例如下面我將如何改變文字「房型」？車把模板源變化

<script id="simple-template" type="text/x-handlebars-template">  
     <div class="row booking-detail-row"> 
      <div class="col-sm-3"><label><strong>Room Type</strong></label></div> 
      <div class="col-sm-9">{{roomTypeName}}</div> 
     </div> 
</script>

親切的問候，法理

來源

2017-02-23 Jure Možina

做翻譯正確，你將需要修改你的模板來處理標籤文本數據，而不是連勝文。

所以你的模板看起來像這樣（在本例中您所提供）：現在

<script id="simple-template" type="text/x-handlebars-template">  
     <div class="row booking-detail-row"> 
      <div class="col-sm-3"><label><strong>{{roomTypeLabel}}</strong></label></div> 
      <div class="col-sm-9">{{roomTypeName}}</div> 
     </div> 
</script>

，您將需要更新您的數據流或在JavaScript應用模板之前攔截它。在JavaScript中做到這一點這裏有一個如何完成它工作示例：

<html> 
 
<head> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/4.0.6/handlebars.min.js"></script> 
 
</head> 
 
<body> 
 

 
<div id="rooms"></div> 
 

 
<script id="simple-template" type="text/x-handlebars-template"> 
 
    <div class="row booking-detail-row"> 
 
     <div class="col-sm-3"><label><strong>{{roomTypeLabel}}</strong></label></div> 
 
     <div class="col-sm-9">{{roomTypeName}}</div> 
 
    </div> 
 
</script> 
 

 
<script> 
 
    function translate(prop, lang) { 
 
     switch(prop) { 
 
      case 'roomType': 
 
       return (lang === 'en') ? 'Room Type' : 'Type de chambre'; 
 
       break; 
 
      default: 
 
       return (lang === 'en') ? 'Unknown' : 'Inconnu'; 
 
     } 
 
    } 
 

 
    function addRoomType(roomTypeData, template, lang) { 
 
     roomTypeData.roomTypeLabel = translate('roomType', lang); 
 
     document.getElementById('rooms').innerHTML = template(roomTypeData); 
 
    } 
 

 
    $(function() { 
 
     var data = { roomTypeName: 'Kitchen' }; 
 
     var source = $("#simple-template").html(); 
 
     var template = Handlebars.compile(source); 
 
     addRoomType(data, template, 'fr'); 
 
    }); 
 
</script> 
 
</body> 
 
</html>

來源

2017-02-23 19:18:05 rasmeister

感謝這個例子，但我需要的是通過JS修改這個模板，如果這甚至有可能。不幸的是，我無法訪問模板。我們使用一些現有的軟件，在某些頁面上需要完成一些翻譯。此軟件的更新每年都會發生，並聯系開發人員團隊以更改此軟件不是一種選擇。所以我需要一些黑客來做一些翻譯:)這是可能的嗎？ –

車把模板源變化

回答

相關問題