Полимер, соблюдайте мировой путь, пожалуйста

Question

В Polymer 1.0 ты можешь бросить {{localPropFoo.bar}} а также bar будет наблюдаться за изменениями, если вы используете this.set('localPropFoo.bar', 'new value'); обновить его значение.

Но что делать, если вы хотите привязать шаблон к внешнему объекту, который находится вне вашего контроля? Например, это {{window.globalFoo.bar}} не будет связан с bar изменения, потому что внешний код не зависит от Polymer и не звонит this.set,

Демо на коде

С помощью Object.observe вручную требует дополнительного кода и не работает в FireFox (грязные проверки наблюдаются.js на помощь).

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

Answer 1

Polymer не делает наблюдения из коробки, потому что:

1. Object.observe поддержка не вездесуща, а грязные чеки стоят дорого.
2. Object.observe может быть дорого на себя.

Предполагаемое решение

Ловите перемены сами, звоните notifyPath, this.fire('global-foo-changed', {path: 'globalFoo.bar', value:...}, this.set а также this.push,
Все они отправляют соответствующие не пузырящиеся (захват) globalFoo-changed пользовательские события (только при необходимости).

Почему мой global-foo-changed события влияют только на this элемент?

1. global-foo-changed события захвата (не пузырьковые).
2. Полимерные элементы прослушивают пузырьковые события по умолчанию.
3. По какой-то причине эти захватывающие слушатели захватывают события пузыря, отправленные от того же элемента (не от его дочерних элементов). Демо на коде.

Вы можете исправить полимер с таким поведением (я не понимаю, как это работает):

SharedGlobalsBehavior = {
  properties: {
    globalFoo: {
      type: Object,
      notify: true,
      value: globalFoo
    }
  },
  created: function() {
    window.addEventListener('global-foo-changed', () => {
      if (!event.detail || !event.detail.path)
        return; // Property initialization.
      this.notifyPath(event.detail.path, event.detail.value);
    },/* if capturing */ true);
  }
};

Почему нет наблюдения из коробки

... иногда императивному коду необходимо напрямую изменять подсвойства объекта. Поскольку мы избегаем более сложных механизмов наблюдения, таких как Object.observe или грязной проверки, для достижения кроссплатформенной производительности при запуске и во время выполнения для наиболее распространенных случаев использования, изменение под-свойств объекта напрямую требует взаимодействия с пользователем.

В частности, Polymer предоставляет два метода, которые позволяют уведомлять систему о таких изменениях: notifyPath (путь, значение) и set (путь, значение), где путь - это строка, идентифицирующая путь (относительно элемента хоста).