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. Flash与DIV的层叠顺序问题

    很多人在写页面代码时都会遇到过这样一个问题,那就是当Flash与页面中的其它HTML结构有重叠的时候,默认情况下Flash总是显示在最上 面,从而遮挡住了与它有重叠部分的HTML结构,就算为该Flas ...

  2. DataGrid GridView 单页javascript 表头排序

    JS代码如下: <script> var curObj; var shell = 1; function sortTable(L) { var start=new Date() var i ...

  3. eclipse中build path 中JDK与java compiler compliance level的问题(转)

    roject facets做什么用? http://baike.baidu.com/view/6257360.htm,其实我感觉,就是让我们在创建项目时候,可以独立定义一个有一个模板供我们使用,在里面 ...

  4. 真机测试,Xcode报错:process launch failed: Security

    解决办法:手机->通用->设备管理->信任开发商应用即可

  5. 以下是jQuery和JavaScript实现相同操作的等价代码。

    选择元素  Javascript代码 1.// jQuery   2.var els = $('.el');   3.  4.// 原生方法   5.var els = document.queryS ...

  6. 查找Mysql数据库连接jar包和对应的Driver和Url

    以前写jdbc连接向来都是直接copy,对于连接数据库的jar包在哪下载,对应的Driver类是哪一个,数据库连接串怎么找等等都没有做过,今天从零开始整了一遍. 使用的数据库是Mysql 一.已安装了 ...

  7. 删除MSMQ中的消息队列时"访问被拒绝的错误"

    删除MSMQ中消息队列时出现 google之,发现也没有找到解决方法,自己在琢磨一下,一般出现这种问题的都是权限问题,因此查看了一下属性,果然如此 此消息队列是使用Windows服务创建的 解决办法: ...

  8. c# windows 服务学习

    用C#做windows服务变得简单对了===按照下面步骤来就行了 用C#创建Windows服务(Windows Services)例子服务功能:这个服务在启动和停止时,向一个文本文件中写入一些文字信息 ...

  9. Poweroff – 很好很强大的定制关机工具

    Poweroff – 很好很强大的定制关机工具 Poweroff 是一个用来管理电脑关机系统的小工具,支持定时,支持远程 作者开放源代码,有兴趣的同学可以尝试着制作一下汉化版本.   可以设定不同时间 ...

  10. Properties配置文件

    package file; import java.io.FileOutputStream; import java.io.FileReader; import java.io.FileWriter; ...