Как связать данные внутри <head> документа с помощью Polymer?

data-binding polymer html-head

31 просмотра

1 ответ

Как связать данные внутри <head>тега документа с помощью Polymer?

Я спрашиваю об этом, потому что информация о странице, как, например, <title>должна меняться в зависимости от того, какую страницу просматривает пользователь, и я хотел бы, чтобы она оставалась неизменной в остальной части фреймворка при написании <title>{{title}}</title>.

Спасибо

Автор: willsquire Источник Размещён: 08.11.2019 11:29

Ответы (1)


1 плюс

Я подозреваю, что это невозможно, потому что для привязки данных к работе элемент (или элемент с textContent) должен быть унаследован от Polymer, что, конечно, headили titleнет.

Что вы могли бы сделать, это создать элемент ( <proxy-title>?), Который размещается в основном теле и который программно в наблюдателе находит элемент title в dom и записывает свойство title, которое он имеет.

Что-то вроде

<dom-module id="proxy-title">
  <template>
    <style>
      :host {
        display:none;
      };
    </style>
  </template>
  <script>
    Polymer({
      is: 'proxy-title',
      properties: {
        title: {
          type: String,
          value: '',
          observer: '_titleChanged'
        }
      },
      _titleChanged: function(title) {
        document.title = this.title;
      }

    });
  </script>
</dom-module>

Вы бы использовали это так

<!DOCTYPE html>
<html lang="en">
<head>
<title></title>
<!-- other head stuff -->
</head>
<body>
  <proxy-title title="[[someTitle]]"></proxy-title>

  <!-- ... other stuff here -->

</body>
</html>   
Автор: akc42 Размещён: 20.08.2016 05:50
Вопросы из категории :
32x32