我是车把的初学者。我正在使用把手从提取方法中检索json数据。我已将模板添加到hbs文件中并尝试在编译模板之前获取该id的innerHTML。但是，当我得到id =“ note-test”的innerHTML时，我得到的是空数据。我有什么想念的吗？
console.log(' notes app script')
const input_title= document.getElementById('title-note')
const input_note= document.getElementById('note')
var btn_submit=document.getElementById('submit-note')
const btn_getNotes=document.getElementById('getnotes')
const div_notes=document.getElementById('data-notes')
btn_submit.addEventListener('click',function(e){
const title=input_title.value;
const data=input_note.value;
const note={
"title": title,
"note": data
}
fetch('/notes', {
method: 'post',
headers: {
'Content-Type': 'application/json;charset=utf-8'
},
body: JSON.stringify(note)
}).then(function(response) {
div_notes.innerHTML='<h3>Note is added sucessfully</h3>'
//window.alert('Note is Added successfully')
// window.location="/notespage"
if(response){
return response.json();
console.log(response.json());
}
})
})
btn_getNotes.addEventListener('click',function(e){
fetch('/notes',{
method: 'get',
headers: {
'Content-Type': 'application/json;charset=utf-8'
},
}).then(function(data){
data.json().then((data)=>{
var notes_data ={};
notes_data.notes = data;
var data=notes_data
console.log('data')
console.log(data)
var note_data=document.getElementById("note-test").innerHTML;
console.log('---data from html---)')
console.log("test"+note_data)
var tpt=Handlebars.compile(note_data)
var note_dt=tpt(data)
document.getElementById("notes").innerHTML=note_dt;
})
}).catch((error)=>{
console.log(error)
})
})<!DOCTYPE html>
<head>
<title>Notes App</title>
{{!-- <script src="https://twitter.github.io/typeahead.js/js/handlebars.js"></script> --}}
<script src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/4.0.11/handlebars.js"></script>
{{!-- <script src='../static/handlebars-v4.7.6.js'></script> --}}
</head>
<body>
<form>
<label for="title" class='title-text'><b>Title</b></label>
<input type="text" placeholder="Title for your notes" id="title-note" required>
<input type="text" placeholder="Start typing....." id="note" required>
<button type="button" id='submit-note'>send</button>
<button type="button" id='getnotes'>Get notes</button>
<div id='data-notes'></div>
<script type="text/x-handlebars-template" id="note-test">
{{#each notes}}
<div ({{this.title}}) class=title-template>
<b>{{this.title}}</b>: {{note}}
</div>
{{/each}}
</script>
<div id='notes'>
</div>
</form>
<link rel="stylesheet" type="text/css" href="../static/css/style.css">
<script src='../static/js/notes.js' ></script>
</body>
</html>将.json更改为.lean-> return response.json();更改为return response.lean();后尝试