Use templateUrl instead url

Hi. When i use templateUrl parameter instead url, for tabs wrapper, then i see blank page. Else titles on tabs not compiled and i see {{trans @global.dictionary.buttons.settings}}

%D0%A1%D0%BD%D0%B8%D0%BC%D0%BE%D0%BA%20%D1%8D%D0%BA%D1%80%D0%B0%D0%BD%D0%B0%20%D0%B8%D0%B7%202019-12-10%2012-54-54

Минимальный пример кода на jsfiddle?

Честно говоря не знаю как в нем раскидать файлы шаблонов и потом подключать.

Вот собственно документация: https://framework7.io/docs/tabs.html#routable-tabs

там у роута указывается url, я так понимаю тупо хтмл, а мне нужно подсунуть шаблон, чтобы интерпретировались конструкции {{trans ‘test’}}. Есть ощущение, что системой такое не предусмотрено.

Какой контент отображается?

Если использую url, то все нормально.
То есть отображаются вкладки и содержимое текущей вкладки. Косяк в только что названия вкладок не интерпретируются. А если ставлю templateUrl то пустая страница. В консоли/сеть идет запрос на pages/index.html и все. Сам контент в консоли не посмотрел, подумал что пусто и там, вечером посмотрю.

Пример вкладки с шаблоном из Template7, которая не работает?

Попробовал щас тестовый проект развернуть. Все отработало. Странно. Свой проект дома не коммитил, поэтому щас сам не могу посмотреть. Вечером буду разбираться, отпишусь.

Сейчас правда был небольшой тупняк. Не мог понять почему хелпер не работал шаблонный, а он оказывается только с параметрами работает.

Тестовый реп где все сработало

Лучше работать с componentUrl - там можно использовать всю мощь F7.

С компонентами не разбирался, с vue не знаком.

Короче по топу разобрался, сам виноват. Косяк был в том, что в конструкции использовался ключик, которого не было {{trans @global.dictionary.titles.page.friends}} а консоль об этом молчала.

Всплыл правда аналогичный вопрос: как использовать конструкции шаблонизатора в головном index.html файле, например для тега title?

Vue тут не причем, я про F7 Core

Только “вручную”

Это доступ к глобальным данным Template7. При использовании же Router Component будет изолированная структура, данные будут внутри компонента.

Просто заметил здесь:
If you know what is Vue component, then it will be much easier to understand as it looks pretty sim

мне на самом деле нужна в данной ситуации глобализация. это общий, глобальный для всего приложения словарь для перевода.

Насчет вручную не понял, это как?

Ядро фреймворка - F7 Core. Относительно мощное, есть VDOM. Фреймворк также из коробки поддерживает Vue и React, использование которых, конечно, дают мощь, но не всегда оправдано.

Для перевода я использую библиотеку i18 и вот такой хелпер:

Template7.registerHelper('t', function (text, options) {
    return this.$app.methods.translate(text);
});

а в самих шаблонах пишу без всяких ключей: {{t “Кнопка”}}

Переводы хранятся в en.js словарем.

У вас же обычный DOM. Вы можете менять любые теги, в том числе <title>, также можете компилировать любой шаблон Template7 и вставлять его в любое место документа. Так что да, это возможно, но в таком вот ручном режиме, не так как в Router Component.

А, понял. Неприятно конечно выглядит как костыль.

Я пользуюсь i18next, но задумал немного другую концепцию. Минус вашей в том, что придется хранить толстые ключи для каждого языка = большой размер исходников. И изменение одного ключа повлечет изменение для каждого языка. + нету подсказок IDE.

Это идея не моя, она взята из фреймворка Yii. На практике получается быстро потому, что не нужно запоминать ключи.

В Yii есть утилита, она сканирует все файлы и делает словари с диффами.