聚合物數據綁定無dom綁定

我有一個聚合物元素<my-element>與計算屬性myProperty。我需要綁定myProperty在HTML頁面另一個地方，所以我不能把它放在dom-bind模板聚合物數據綁定無dom綁定

這裏面就是我的意思

<html> 
    <body> 
     <div> 
      <my-element my-property="{{myProperty}}"></my-element> 
     </div> 
     <!--somewhere deep inside another part of the document--> 
     <div> 
      <h4>myProperty = </h4><span>[[myProperty]]</span> 
     <div> 
    </body> 
</html>

我不能完成my-element和[[myProperty]]在使用dom-bind模板，因爲這會導致幾乎整個文檔被包含在此中。試圖使用綁定，因爲它會顯示myProperty = [[myProperty]]，而不是[[myProperty]]的值。

是否有某種方法可以使數據綁定的行爲類似於整個HTML文檔，但可以使用？（將來可能還會出現在<my-second-element my-property="[[myProperty]]">等屬性內使用[[myProperty]]的情況）。或者如果兩個事件都被單獨封裝在dom-bind模板中，是否有一些方法可以使綁定全局？

在此先感謝

來源

2015-11-25 Luke Moll

不知道爲什麼你會不能夠這樣做：

<head> 
    ... 
    <script src="bower_components/webcomponentsjs/webcomponents-lite.js"></script> 
    ... 
</head> 

<html> 
    <body> 
     <template is="dom-bind" id="app"> 
     <div> 
      <my-element my-property="{{myProperty}}"></my-element> 
     </div> 
     <!--somewhere deep inside another part of the document--> 
     <div> 
      <h4>myProperty = </h4><span>[[myProperty]]</span> 
     <div> 
     </template> 
    </body> 
</html>

這是完全可行的。如果myProperty在my-element內更改，它也會在「此」html文檔中更改。此外，還不會增加你的第二個元素的問題：

<my-second-element my-property="[[myProperty]]">

除非你缺少告訴我們，你需要一些特定的行爲，這應該是你想要的。 :)

來源

2015-11-25 20:10:04 Whyser

爲了緊湊，我大大簡化了結構。 'div'標籤共享的第一個父節點包含了一個非常複雜的網站的其餘部分，'div'本身至少包含6層DOM。包裝這個無關內容的想法似乎打敗了聚合物的目標 –

我不確定我是否遵循。您要求：「[...]但在整個HTML文檔中可用」。這正是這些代碼完成的。如果您只需要頁面的一部分，那麼只需在'dom-bind'中包裝頁面的這一部分。 – Whyser

對不起，我不清楚。我需要頁面的兩個部分，一個包含''，另一個包含' [[myProperty]]'。這個想法是，每個部分可以在文檔中的任何地方（例如，導航欄中的一部分和主要內容部分中的另一部分，而不必將整個身體包裹在模板中） –

聚合物數據綁定無dom綁定

回答

相關問題