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. tabpagerindictor:mergeReleaseResources FAILED Error:Execution failed for task ':tabpagerindictor:mergeReleaseResources'. > D:\android\adt-bundle-windows-x86_64-20140702\android-open-project-demo-mast

    解决:将项目移动到路径少的目录再运行即可 异常日志: D:\android\adt-bundle-windows-x86_64-20140702\android-open-project-demo-m ...

  2. Objective-C学习篇09—NSNumber与笑笑语法

    NSNumber 由于数组,字典,集这三个容器中只能存放对象类型的数据,如果想把基本数据类型的数据存放到这三个容器中,需要把基本数据类型转化为对象类型,此时就要借助于NSNumber 这个类. NSN ...

  3. java J2EE学习入门

    首先学习JAVA基础编程,大学教材就是最简单的了!象写写Helloworld啊 输出水仙花数啊 玩些简单的,慢慢在研究研究流啊,都可以了.然后学习简单的JSP,这个时候多上网上DOWN一些原码.多看看 ...

  4. Java Tomcat 中调用.net DLL的方法

    近日一个java的项目,客户要求项目中必须使用其提供的加密机制,扔给了两个.net写的DLL.网络上搜了一圈也没找到啥东西,甚至看到人扬言此事绝无可能.郁闷当中考虑了一个思路.用C#做一个Com,调用 ...

  5. Linux_cloudera-scm-agent: unrecognized service

  6. IOS开发之免费证书+不越狱真机调试

      本文转自:http://www.cnblogs.com/weii/p/4688299.html 苹果发布Xcode7后, 开放了普通的AppleID也能真机调试,非$99 或 $299, 只要能上 ...

  7. Spark Streaming Backpressure分析

    1.为什么引入Backpressure 默认情况下,Spark Streaming通过Receiver以生产者生产数据的速率接收数据,计算过程中会出现batch processing time > ...

  8. 两段小PYTHON，作啥用的，行内人才懂~~~：（

    哎,作也不是,不作也不是.... 下次有更新文件时,直接刷新一次了. #coding: UTF-8 import sys reload(sys) sys.setdefaultencoding( &qu ...

  9. Smarty include使用

    {include} {include}用于载入其他模板到当前模板中. 在包含模板中可用的变量,载入后在当前模板仍然可用. {include}必须设置file 属性,设置载入的文件资源路径. 设置了可选 ...

  10. mysql undo

    mysql> show variables like '%undo%'; +-------------------------+-------+ | Variable_name | Value ...