Пользовательская функция закрытия Undefined JS Browser - PullRequest
0 голосов
/ 11 марта 2019

У меня есть очень простая html-страница, где я ставлю этот скрипт в конце:

<?php echo $this->Html->script(['studiomain.js']); ?>
</html>

Скрипт содержит IIF в JS:

window.studiomain =  window.studiomain || (function ($) {
     let _dataTable = '';
     let _modalTemplates = {};
     let _webroot   = 'studioasq';
     function setDataTable (t, options={}) {
        _dataTable = $(t);
        if (typeof $(t).DataTable == 'function') {
           options.language = {
              "url": "/" + _webroot + "/js/datatable/i18n/Italian.json"
        }
        $(t).DataTable(options);
       }
    }
    function setModal(key='',template='') {
        _modalTemplates[key] = template;
    }
    function renderModal(key,data={}) {
       if (_modalTemplates[key] !== undefined) {
           let copy = _modalTemplates[key];
             Object.keys(data).forEach((key) => {                
               copy.replace(new RegExp("{{" + value + "}}","g"),data[key]);
        })
       }
       return $('#'+key);        
    }
  return {
    setDataTable,
    setModal,
    renderModal
}

})($);

Но когда страница заканчиваетсязагрузка, у меня нет studiomain в окне:

window.studiomain => undefined.

Я думаю, что проблема заключается в функции renderModal: если я удаляю это все в порядке.Чего мне не хватает?

**** ОБНОВЛЕНИЕ ****

Следуя советам, я думаю, что проблема заключается в порядке загрузки скриптов и передачи ссылки на JQuery.

Я также обнаружил, что передача (jQuery) и NOT ($) в IIF работает.

1 Ответ

0 голосов
/ 11 марта 2019

Полагаю, вы пытаетесь достичь модульного шаблона.

В вашем коде вам нужно будет возвращать все внутри функции, иначе каждый код без возврата будет в приватном состоянии.

Исправление вашего кода, вам нужно вернуть window.studiomain в качестве параметра, ваш код будет работать, $ не определен, поэтому он не хранится внутри объекта окна

window.studiomain = window.studiomain || (function($) {
  let _dataTable = '';
  let _modalTemplates = {};
  let _webroot = 'studioasq';

  function setDataTable(t, options = {}) {
    _dataTable = $(t);
    if (typeof $(t).DataTable == 'function') {
      options.language = {
        "url": "/" + _webroot + "/js/datatable/i18n/Italian.json"
      }
      $(t).DataTable(options);
    }
  }

  function setModal(key = '', template = '') {
    _modalTemplates[key] = template;
  }

  function renderModal(key, data = {}) {
    if (_modalTemplates[key] !== undefined) {
      let copy = _modalTemplates[key];
      Object.keys(data).forEach((key) => {
        copy.replace(new RegExp("{{" + value + "}}", "g"), data[key]);
      })
    }
    return $('#' + key);
  }
  return {
    setDataTable,
    setModal,
    renderModal
  }

})(window.studiomain);

console.log(studiomain);
...