Polymer自定義元素屬性/屬性與.NET MVC剃刀結合：@ DateTime.Now.Year

Question

我使用的聚合物/ WebComponentsJS/.NET MVC

我曾與他們很好的經驗，到目前爲止，我坐在這個上午寫教程，我從一個非常基本的例子開始。然而，我所做的第一次約束讓我在一堵磚牆上。有人可以解釋這段代碼發生了什麼，以及它爲什麼不綁定數據。這是一個非常基本的自定義元素，只有一個屬性「currentyear」。該標記直接從Visual Studio中的ASP.NET MVC模板中獲取，並放置在此自定義元素html文件中。

<dom-module id="my-footer"> 

<template> 
    <style> 
     /* CSS rules for your element */ 
    </style> 

    <!-- local DOM for your element --> 
    <!-- data bindings in local DOM --> 
<footer> 
    <p>&copy; {{currentyear}} - My Footer Version 1</p> 
</footer> 
</template> 

<script> 
    // element registration 
    Polymer({ 
     is: "my-footer", 

     // add properties and methods on the element's prototype 
     properties: { 
      // declare properties for the element's public API 
      currentyear: String 
     }, 
     //builtin functions of custom element lifecycle 
     created: function() { 
      console.log(this.localName + '#' + this.id + ' was created'); 

     }, 

     attached: function() { 
      console.log(this.localName + '#' + this.id + ' was attached'); 
      this.async(function() { 
       // access sibling or parent elements here 
       // THIS WORKS and displays value in console 
       console.log(this.localName + '#' + this.id + ' current year is: ' + this.currentyear); 
      }); 
     }, 

     detached: function() { 
      console.log(this.localName + '#' + this.id + ' was detached'); 
     }, 

     attributeChanged: function (name, type) { 
      console.log(this.localName + '#' + this.id + ' attribute ' + name + ' was changed to '); 
     }, 

     ready: function(){ 
      console.log('on READY the value of current year property is: ' + this.currentyear); 
     } 

    }); 
</script> 

<my-footer currentyear="@DateTime.Now.Year"></my-footer> 

---

當我寫這篇文章，我解決我的問題，但還是不明白爲什麼它不與原來的標記結合。

我從此改變了HTML標記：

<footer> 
    <p>&copy; {{currentyear}} - My Footer Version 1</p> 
</footer> 

這樣：

<footer> 
<p><span>&copy;</span> <span>{{currentyear}}</span><span> - My Footer Version 1</span></p> 
</footer> 

和它的工作！在轉向StackOverflow進行某些輸入之前，至少有一個小時的時間花在檢查我的代碼上。

我嘗試這樣做，它也可以工作：

<p>&copy; <span>{{currentyear}}</span> - My Footer Version 1</p> 

Answer 1

有聚合物文檔微妙，必須指出：

The binding annotation must currently span the entire content of the tag

這就是爲什麼添加包裝元素就像你解決了這個問題一樣。從我發現的情況來看，Polymer甚至不允許標籤和綁定表達之間存在空白區域。