Sencha Touch 2 MVC - запросы Ajax перед инициализацией приложения - PullRequest
Новая
       1

Sencha Touch 2 MVC - запросы Ajax перед инициализацией приложения

0 голосов
/ 07 января 2012

Поскольку у Sencha Touch нет официального способа интернационализации, я пишу свой небольшой набор утилитарных методов. Я не буду встраивать другую библиотеку, такую ​​как jQuery, чтобы использовать уже существующие плагины i18n. На данный момент у меня проблемы с поиском лучшего способа. В настоящее время у меня есть класс, реализованный как Singleton. В конструкторе я определяю язык и загружаю соответствующий языковой файл. Сейчас я использую методы Sencha, определяю модель и загружаю данные (json) в хранилище. Я думаю, что это довольно удобно. Вот фрагмент из конструктора, куда я загружаю данные: 

        Ext.define('Translation', {
        extend: 'Ext.data.Model',
        idProperty: 'key',
        fields: [
            {name: 'key', type: 'string'},
            {name: 'translation', type: 'string'}
        ],
        proxy: {
            type: 'ajax',
            url: 'res/translation-'+lang+'.json', 
            //appendId: false,
            reader: {
                type: 'json',
            }
        }
    });

    _store = Ext.create('Ext.data.Store', {
        model   : 'Translation',
        autoLoad: true
    });

Проблема здесь в том, что загрузка асинхронная (нельзя делать синхронный вызов с sencha ?!), что означает, что приложение может начать загружаться до того, как закончится этот процесс. Мне нужны данные, потому что взгляды основаны на них. 

Ext.Loader.setConfig({enabled:true});
Ext.application({
name: 'MyApp',
controllers: ['Ctr1', 'Ctr2'],
models: ['Model1', 'Model2],
init: function() {

},
launch: function() {

}
});

Единственные решения, которые я нашел, были бы

  1. используйте обратный вызов и оберните инициализацию приложения внутри.
  2. Не используйте Sencha и выполняйте запрос ajax вручную.
  3. Не используйте Ajax вообще. Поместите переводы для всех языков в файл javascript, включите его в index.html и убедитесь, что служебный класс имеет доступ к объекту.

Ответы [ 3 ]

1 голос
/ 13 февраля 2012

Уже есть расширение i18N, посмотрите здесь.

https://github.com/elmasse/Ext.i18n.Bundle-touch

0 голосов
/ 01 августа 2012

Посмотрите эту запись, это может помочь: Sencha Touch i18n основы

И мой ответ, может быть, это поможет вам.

Для своих собственных строк (не говоря о собственном сенсорном компоненте) вы можете сделать что-то вроде этого.

1) В ваш index.html в разделе head загрузите файл LocaleManager.js (независимо от имени) перед

<script id="microloader" type="text/javascript" src="sdk/microloader/development.js"></script>

В вашем localeManager, в зависимости от языка вашего браузера, загрузите файл ресурсов, соответствующий вашему языку (myStrings-fr.js | myStrings-en.js)

Вы можете сделать что-то вроде этого, чтобы получить язык в браузере: 

window.navigator.language || window.navigator.userLanguage || window.navigator.browserLanguage || window.navigator.systemLanguage

2) Создайте файлы ресурсов с переведенной строкой

Это должно выглядеть так для английской версии (myStrings-en.js): 

var myStrings = {
MyPackage1: {
    myString1: 'Seach...'
}};

Это должно выглядеть так для французской версии (myStrings-fr.js), например: 

var myStrings = {
MyPackage1: {
    myString1: 'Recherchez...'
}};

3) В вашем сенсорном коде sencha, например, для значения заполнителя поля поиска 

xtype: 'searchfield',
id: 'searchToolbarItem',
placeHolder: myStrings.MyPackage1.myString1

Надеюсь, это поможет.

Другим решением может быть изменение процесса сборки вашего сенсорного приложения sencha и создание локализованных версий вашего приложения при его создании. Таким образом, будет одна версия для каждого языка. Затем, в зависимости от языка браузера, вы загружаете правильную версию своего приложения при загрузке приложения в браузере.

0 голосов
/ 13 февраля 2012

Нет простого способа сделать это с помощью Sencha Touch.Лучше всего сделать синхронный Ajax-запрос на json-файл с переводами, а затем разрешить запуск приложения после этого.

...