2015-06-19 36 views
2

我正在開發一個受polymer starter kit啓發的應用程序,在Chrome中一切正常,但在Safari中使用{{route}}{{user}}標記爲空值。Google Polymer 1.0 - 自動綁定模板值爲空?

我注意到在香草樹聚合物入門套件中,Chrome和Safari中的自動綁定模板值都不是空的。任何幫助或洞察發生了什麼,以及爲什麼我的自動綁定模板值在Safari中爲空將非常感激。

這裏是我到目前爲止有:

routing.html

<script src="page/page.js"></script> 

<script> 
    window.addEventListener('WebComponentsReady', function() { 
     page('/', function() { 
      app.route = 'home'; 
      app.user = 'Alex'; 
     }); 

     // Initialize router. 
     page(); 
    }); 
</script> 

elements.html

<link rel="import" href="iron-flex-layout/iron-flex-layout.html"> 
<!-- <link rel="import" href="iron-ajax/iron-ajax.html"> --> 
<link rel="import" href="iron-pages/iron-pages.html"> 
<link rel="import" href="paper-material/paper-material.html"> 
<link rel="import" href="paper-header-panel/paper-header-panel.html"> 
<link rel="import" href="paper-toolbar/paper-toolbar.html"> 
<link rel="import" href="paper-styles/paper-styles-classes.html"> 
<link rel="import" href="routing.html"> 
<link rel="import" href="app-theme.html"> 

index.html

<!doctype html> 
<html> 

<head> 
    <meta charset="utf-8"> 
    <meta name="generator" content="BYU MFA Enrollment" /> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <title>BYU MFA Enrollment</title> 

    <link rel="stylesheet" href="main.css"> 
    <script src="webcomponentsjs/webcomponents.min.js"></script> 
    <link rel="import" href="elements.html"> 
</head> 

<body unresolved class="fullbleed layout vertical"> 
    <template is="dom-bind" id="app"> 
     <paper-header-panel mode="waterfall-tall"> 
      <paper-toolbar id="mainToolbar"> 
       <div class="middle paper-font-display2">BYU MFA Enrollment</div> 
      </paper-toolbar> 
      <iron-pages attr-for-selected="data-route" selected="{{route}}"> 
       <section data-route="home"> 
        <paper-material elevation="1"> 
        <h3>Welcome to BYU MFA Enrollment! Lets get going <span>{{user}}</span>!</h3> 
        </paper-material> 
       </section> 
      </iron-pages> 
     </paper-header-panel> 
    </template> 
</body> 

</html> 

謝謝!

回答

0

我試圖取代:

<script src="webcomponentsjs/webcomponents.min.js"></script> 

有:

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

瞧!我的數據綁定在Safari中開始工作!這對我來說很奇怪,因爲如果我理解正確的話webcomponents-lite只是應該是webcomponents的輕量版本。

無論如何,如果任何人有一個更深入的解釋/回答,請發表它,因爲我真的不知道爲什麼這個工作只是它的工作,而且我更喜歡也知道爲什麼。否則,我會在幾天內接受這個答案。

相關問題