聚合物1.0自动绑定模板

Polymer 1.0 auto binding templates

本文关键字:绑定 聚合物      更新时间:2023-09-26

我正在尝试让自动绑定模板成功工作。这就是我迄今为止所做的。该页面不以值"greeting"呈现。它输出{{问候语}}。

<!doctype html>
<html lang="">
<head>
  <link rel="stylesheet" href="styles/main.css">
  <script src="bower_components/webcomponentsjs/webcomponents-lite.js"></script>
  <link rel="import" href="bower_components/polymer/polymer.html">
</head>
<body>
   <template is="dom-bind" id="app" >
    <span>  {{greeting}} </span>
  </template>
  <script src="scripts/app.js"></script>
</body>
</html>

app.js

(function(document) {
  'use strict';
  var app = document.querySelector('#app');
  app.greeting = "Hello";
})(document);

它适用于聚合物0.5.5http://plnkr.co/edit/fmL9xQEXKwnINzdL3rBj?p=preview

您的{{greeting}}绑定必须是标记的唯一内容(聚合物文档:绑定到文本内容)。您需要删除周围的空白:

<template is="dom-bind" id="app" >
  <span>{{greeting}}</span>
</template>