2016-03-07 40 views
0

這是我第一次使用聚合物和JavaScript。我想知道是否可以使用dom模塊屬性作爲js函數參數。這裏是我的一段代碼:在js標籤中使用dom模塊屬性

<dom-module id="sustenagro-matrix" attributes="numbers params space"> 
    <template> 

     <script type="text/javascript"> 
      Matrix(space, params); 
     </script> 
    </template> 

    <script> 
     Polymer({ 
      is: "sustenagro-matrix" 
     }); 
    </script> 
    </dom-module> 

我想使用數字和空格作爲js函數Matrix的參數。它甚至有可能嗎?有沒有另一種方法來完成它?

感謝; d

編輯:

新代碼:

<dom-module id="sustenagro-matrix"> 
<template> 

    <h1>SustenAgro Matrix {{number}}</h1> 
    <h2>{{params}}</h2> 

    <script type="text/javascript"> 
     //Matrix(space, params); **SPACE AND PARAMS DON'T WORK HERE. HOW CAN I GET THEM?** 
    </script> 
</template> 

<script> 
    Polymer({ 
     is: "sustenagro-matrix", 
     properties: { 
      numbers: Number, 
      params: String, 
      space: String 
     } 
    }); 
</script> 

回答

0

你可以得到一個參考使用DOM方法一樣的getElementById或您的自定義元素引用這些值querySelector,例如:document.getElementById('mymatrix')。space

另外,Polymer 1.x不使用attributes屬性,這些屬性都由Polymer()自定義元素註冊中的屬性對象處理。

+0

我固定性質問題,但我得到什麼時候<腳本類型= 「文本/ JavaScript的」> window.alert(的document.getElementById( 'sustenagro矩陣')。數字。值); 執行 –

1

下面是一些(工作)示例代碼,可能會指向正確的方向。

<!doctype html> 
 
<head> 
 
    <base href="http://polygit.org/components/"> 
 
    <script src="webcomponentsjs/webcomponents-lite.min.js"></script> 
 
    <link href="polymer/polymer.html" rel="import"> 
 
</head> 
 
<body> 
 
    <x-example numbers="3" spaces="2" params="hi"></x-example> 
 
    <dom-module id="x-example"> 
 
    <template> 
 
     <h1>SustenAgro Matrix {{number}}</h1> 
 
     <div id="matrix"></div> 
 
    </template> 
 
    <script> 
 
     // only need this when in the main document and on non-Chrome 
 
     addEventListener('WebComponentsReady', function() { 
 
     Polymer({ 
 
      is: 'x-example', 
 
      observers: [ 
 
      'buildMatrix(numbers, spaces, params)' 
 
      ], 
 
      buildMatrix: function(numbers, spaces, params) { 
 
      this.$.matrix.innerHTML = Matrix(numbers, spaces, params); 
 
      } 
 
     }); 
 
     }); 
 
    </script> 
 
    </dom-module> 
 
    <script> 
 
    // just so there is something, I don't know what your function does exactly 
 
    Matrix = function(n, s, p) { 
 
     return [n, s, p].join('|'); 
 
    } 
 
    </script> 
 
</body>