Polymer, cách lấy thông số url trong page.js thành phần tử polymer?

Question

Tôi muốn tạo một ứng dụng đơn. Khi tôi đi đến đường dẫn như localhost/person-info/101, làm thế nào tôi có thể nhận được thông số URL bằng cách sử dụng page.js thành một phần tử Polymer?

tôi phải sử dụng các params để chọn hoặc thay đổi dữ liệu trong các yếu tố person-info trước khi sử dụng neon-animated-page để thay đổi trang

Nội dung app.js:

window.addEventListener('WebComponentsReady', function() { 
    var app = document.querySelector('#app'); 
    page('/', home); 
    page('/person-info/:user', showPersonInfo); 

    page({ 
     hashbang: true 
    }); 

    function home() { 
     app.route = 'index'; 

     console.log("app route" + app.route); 
     console.log("home"); 
    } 

    function showPersonInfo(data) { 
     console.log(data); 
     console.log(data.params.user); 

     app.params = data.params; 

     app.route = 'person-info'; 
    } 
}); 

Và yếu tố Polymer tôi person-info.html

<link rel="import" href="bower_components/iron-list/iron-list.html"> 
<link rel="import" href="bower_components/polymer/polymer.html"> 
<link rel="import" href="bower_components/paper-toolbar/paper-toolbar.html"> 
<link rel="import" href="bower_components/paper-icon-button/paper-icon-button.html"> 

<script type="text/javascript" src="bower_components/jquery-2.1.4.min/index.js"></script> 
<script src="js/app.js"></script> 

<dom-module id="person-info"> 
    <style> 
     :host { 
      display: block; 
      font-family: sans-serif; 
      @apply(--layout-fit); 
      @apply(--layout-vertical); 
     } 

     .toolbar { 
      background: #3f78e3; 
     } 

     a { 
      color:#FFF; 
     } 
    </style> 
    <template id="person-info"> 
     <paper-toolbar class="toolbar"> 
      <a href="/"> 
       <paper-icon-button icon="icons:arrow-back"></paper-icon-button> 
      </a> 

      <div>test</div> 
      <div>test</div> 
     </paper-toolbar> 
     <content></content> 
    </template> 
    <script> 
     Polymer({ 
      is: 'person-info', 
      ready: function() { 
       console.log("person-info page"); 
       this.testdd = "adisak"; 
       console.log("user ---->"+this.params); 
       console.log(this); 
      }, 
      properties: { 
       dataindex: String 
      } 
     }); 
    </script> 
</dom-module> 

Answer 1

Biến số app là toàn cầu, vì vậy nếu bạn liên kết dữ liệu với app.params từ tuyến đường của bạn hơn là bạn có thể truy cập ở mọi nơi bằng cách sử dụng app.params. Hoặc chỉ cần truy cập vào phần tử của bạn và thiết lập các thuộc tính trên phần tử của bạn như dưới đây

function showPersonInfo(data){ 
    var personInfo=document.querySelector('person-info'); 
    personInfo.user=data.params; 
    app.route = 'person-info'; 
} 

Từ yếu tố người-info của bạn, bạn có thể truy cập bằng cách sử dụng this.user nhưng tôi nghĩ rằng bạn cần phải thiết lập thuộc tính user trên thuộc tính nguyên tố.