2015-04-23 1 views
0

Мой вопрос затрагивает общий сценарий с веб-приложениями: у вас есть какие-то элементы db, которые сопоставляются с некоторыми наборами элементов DOM. Например. объект JSON, который сопоставляется с form с некоторыми полями.Как распространять идентификатор db через шаблон Meteor.js?

Теперь представьте, что в разных местах/на разных мероприятиях внутри вашей формы вам нужен этот db id. На определенных уровнях (в определенных контекстах данных) идентификатор будет доступен как this._id в Метеорных событиях, но не во всех, так как операторы sub-#with могут перезаписать контекст данных.

То, что я делаю в настоящее время в этих случаях, задается в шаблоне, содержащем форму <form id="{{_id}}" ...>, а затем в случаях, когда this._id недоступен Я получаю это через $(this).closest('form').id. Это работает.

Но мой вопрос: есть ли лучший способ? как бы вы это сделали с Метеор?

ответ

1

Это то, с чем многие из нас борются ... нужно держать этот DOM чистым амиритом?

  1. Если иерархия DOM предсказуема, вы можете использовать Template.parentData(n) получить контекст родительских данных.

  2. В качестве альтернативы, если нет никакого отношения к контексту, в котором вы нуждаетесь, используйте Blaze.getData(el). У меня такое чувство, что это станет вашим новым лучшим другом. Я знаю, как только я наткнулся на него, я почувствовал, что обманываю, это было так легко. Вот моя любимая польза для него (в случае, перебирает все поля ввода): var checkFields = t.findAll('input'); var allGood = true; for (var i = 0; i < checkFields.length; i++) { if (!simplyValid.validateField(Blaze.getData(checkFields[i]), checkFields[i].value)) allGood = false; }

  3. Далее, если ваш самый верхний модуль имеет собственный маршрут, вы можете сохранить его как железный маршрутизатор пары. Это хорошо, потому что он прикрепляет id в URL-адресе для простого обмена, мне лично нравятся чистые URL-адреса, но другим людям это нравится.

  4. И, наконец, мой собственный шаблон является объектом с областью модуля. В моем случае для каждого маршрута в onCreated я установил свой объект window.M = {}. Затем я заполняю его местными коллекциями, реактивным словарем и всем, что мне нужно. Я очищаю его onDestroyed. Несомненно, это технически глобальный, но область действия умирает с модулем.

  5. #with Ликвидировать: {{#with collection='clients'}} {{>subTemplate}} {{/with}} Becomes {{>subTemplate collection= 'clients'}}

  6. #with Присвоить к объекту в контексте: `` ` {{#with коллекции = 'клиентов'}} {{ > subTemplate имя =» Foobar}} // вы потеряете с контекстом здесь {{/ с}} становится {{> subTemplate коллекции = это имя = 'Foobar'}} // вы держите контекст внутри объекта

  7. доступа исходные родительские данные через двойные точки spacebars' & ссылки, что контекст весь путь вниз {{>subTemplate parent=..}} `` `

Это все модели я в настоящее время использовать, чтобы сохранить чистый DOM. Будет рад изменить, если кто-то другой предложит другое.

+0

Спасибо! К 1: мне не нравится жесткое кодирование структуры DOM в JS. Это как '$ (...).parent() ... .parent() '. В 2: это более похоже на 'Blaze.getData ($ (...). Closeest ('form')) ._ id'. Это хорошо. Но я бы поменял ваш пример на мой фрагмент здесь, поскольку более простой и универсальный. До 3: Да, если вы дадите своим пунктам маршрут, хорошо! Я не. К 4: я действительно не понимаю, как глобальный obj поможет мне найти, например. к которому принадлежит кнопка db obj. Вы имеете в виду, строя реактивный dict с ... что? Вы можете объяснить? –

+0

Для 2 вы можете избежать '.closest', так как вы, вероятно, узнаете элемент формы, и вы можете обратиться к нему напрямую. Для 4 примером будет 'M.collection =" Клиенты ". Тогда ваше событие будет' window [M.collection] .insert() '. Конечно, вы должны использовать пространство имен для своих коллекций и использовать метод сервера, но это суть. 2 еще что я только подумал о том, чтобы покончить с '# with' и передать все в шаблон. Другой вариант - передать все элементы '# with' в объект, например' {{> subTemplate items = this name = 'foobar'}} ' –

+0

Также: на уровне родительского контекста вы хотите получить доступ к' {{#each myArr}} {{> subTemplate parent = ..}} {{/ each}} ', а затем на под-подуровнях' {{#each myArr}} {{> subSubTemplate parent = parent}} { {/}} каждая '. –