install Polymer and explore creating our first custom element:

 bower install polymer

index.html:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Polymer</title>
<script src="bower_components/webcomponentsjs/webcomponents-lite.js"></script>
<link rel="import" href="bower_components/polymer/polymer.html">
<link rel="import" href="./hello-world.html">
</head>
<body>
<hello-world name="ZTW"></hello-world>
</body>
</html>
  • include webcomponents-list.js file
  • import polymer.html file
  • import our compoment hello-world.html file

hello-world.html:

<dom-module id="hello-world">
<template>
<input type="text" value="{{name::keyup}}"> <!-- {{}} two way data binding, ::bind to event -->
<h1>Hello, [[name]]</h1> <!-- [[]] one way data binding -->
</template>
<script>
Polymer({
is: "hello-world" // string match the tag
})
</script>
</dom-module>

[Polymer] Introduction的更多相关文章

  1. A chatroom for all! Part 1 - Introduction to Node.js(转发)

    项目组用到了 Node.js,发现下面这篇文章不错.转发一下.原文地址:<原文>. ------------------------------------------- A chatro ...

  2. Introduction to graph theory 图论/脑网络基础

    Source: Connected Brain Figure above: Bullmore E, Sporns O. Complex brain networks: graph theoretica ...

  3. INTRODUCTION TO BIOINFORMATICS

    INTRODUCTION TO BIOINFORMATICS      这套教程源自Youtube,算得上比较完整的生物信息学领域的视频教程,授课内容完整清晰,专题化的讲座形式,细节讲解比国内的京师大 ...

  4. mongoDB index introduction

    索引为mongoDB的查询提供了有效的解决方案,如果没有索引,mongodb必须的扫描文档集中所有记录来match查询条件的记录.然而这些扫描是没有必要,而且每一次操作mongod进程会处理大量的数据 ...

  5. (翻译)《Hands-on Node.js》—— Introduction

    今天开始会和大熊君{{bb}}一起着手翻译node的系列外文书籍,大熊负责翻译<Node.js IN ACTION>一书,而我暂时负责翻译这本<Hands-on Node.js> ...

  6. 前端组件化Polymer入门教程(8)——事件

    可以在listeners对象中监听事件 <x-custom></x-custom> <dom-module id="x-custom"> < ...

  7. Introduction of OpenCascade Foundation Classes

    Introduction of OpenCascade Foundation Classes Open CASCADE基础类简介 eryar@163.com 一.简介 1. 基础类概述 Foundat ...

  8. 000.Introduction to ASP.NET Core--【Asp.net core 介绍】

    Introduction to ASP.NET Core Asp.net core 介绍 270 of 282 people found this helpful By Daniel Roth, Ri ...

  9. Introduction to Microsoft Dynamics 365 licensing

    Microsoft Dynamics 365 will be released on November 1. In preparation for that, Scott Guthrie hosted ...

随机推荐

  1. ods_yx给用户分配表空间、权限用户等工作内容。

    1.登陆运维审计 huang_cb.bl hac12345 2.找到81.35   root-admin  nwsj*2013 3.打开oracle EMC工具,使用ods_yx用户登陆进EMC里面的 ...

  2. Windows 下 SVN 服务器配置

    1.下载文件,   下载最新版本subversion,我这里选择VisualSVN-Server-2.5.7.exe   2.安装Subversion 服务器   由于我下载的是setup.exe版本 ...

  3. 解释DEFAULT CHARACTER SET utf8 COLLATE utf8_general_ci

    解释DEFAULT CHARACTER SET utf8 COLLATE utf8_general_ci 在创建数据库的时候,经常用到一句:CREATE DATABASE `tpcms` DEFAUL ...

  4. ON DUPLICATE KEY UPDATE 当记录不存在时插入,当记录存在时更新

    MySQL 当记录不存在时插入,当记录存在时更新网上基本有三种解决方法.第一种:示例一:插入多条记录假设有一个主键为 client_id 的 clients 表,可以使用下面的语句:INSERTINT ...

  5. C#结课报告

    Revision History Date Issue Description Author 18/May/2015 v1.0 Initial creation 邓彪翼 模拟图书馆的查询系统 1.ob ...

  6. asp.net能不托管吗?

    弱弱地问一句,整个部署在IIS中的asp.net项目能不托管吗? 或者说有没有用纯粹的非托管语言(比方说C语言)写的非托管asp.net项目?

  7. eclipse下编译openfire3.9.1源码

    [一].下载源码 打开网址:http://www.igniterealtime.org/downloads/source.jsp 选择目前最新版本 openfire_src_3_9_1.zip 下载. ...

  8. wordpress主题制作结构文件

    下面是WordPress主题文件层次结构,它会告诉你:当WordPress显示特定的页面类型时,会使用哪个模板文件呢?只有了解了以下主题层次结构,你才能知道你的WordPress主题到底需要写哪些文件 ...

  9. bat(传参情况下)取得当前bat所在的目录路径

    在传参情况下,取得bat文件所在的目录路径,可以使用: %~dp0 说明: 01.所谓传参情况是指,将某个文件拖放到bat文件上并放开.此种情况下执行的bat命令就是有带参数的. 02.上面末尾的0是 ...

  10. range与xrange

    range与xrange的用法是完全相同的,不同的是返回结果不同:range返回的是一个list,而xrange返回的是一个生成器.可以来看下 print type(range(5)) print t ...