Получение значения от мангуста в переднем конце с использованием шаблона Handlebar

Question

Я видел подобные вопросы, но не смог реализовать. Прости мою неадекватность Я пытаюсь использовать массив объектов в интерфейсе внутри тега сценария. Мой бэкэнд - это узел и база данных мангуст. Фронт-энд, я использовал шаблон руля с сырой JS. Мой внутренний код

UnitType.find()
        .where({ type: type })
        .select("-_id")
        .exec()
        .then(doc=> {
        var unit_types = doc;
        res.render('single-unit', { 
           unit_types: unit_types,
        });
});

Front-End я использовал такие юнит-типы

{{#each unit_types}}
<tr>
<td width="40%">{{this.name_plural}}</td>
<td width="60%">{{this.name_singular}}</td>
</tr>
{{/each}}

В теге сценария--

<script>
var unit_types = [{{unit_types}}] // [{{{unit_types}}}]
<script>

Я использую скрипт для манипулирования данными. Мои данные были бы как

[
  {name_singular:"foot",name_plural:"feet"},
  {name_singular:"yard",name_plural:"yards"},
  ..... // etc.
]

Который работает отлично. Проблема Я сталкиваюсь с двумя проблемами, одна, если я возьму _id из запроса выдает синтаксическую ошибку внутри <script>, Во-вторых, я использую функцию, чтобы сделать первую букву каждого свойства заглавными. Как это в конце--

var unittypes =doc.map(v => {
return {
    name_singular_up:  ucfirst(v.name_singular),
    name_singular: v.name_singular,
    name_plural_up:  ucfirst(v.name_plural),
    name_plural: v.name_plural,

}

Если я отправлю так, то снова внутри <script> снова выдает синтаксическую ошибку, показывая [Object object] в хромированном элементе. Но данные в шаблоне работают правильно. Я нашел рабочий метод, используя ajax.get, Но я бы хотел сделать это без использования ajax, Что я здесь не так делаю? Заранее спасибо.