angular2属性绑定

使组件的标题每秒随机换色一次

-代码开发如下:


<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>组件开发--模版基本语法title>
    <script src="lib/system.js">script>
    <script src="lib/system.config.js">script>
    <script src="lib/angular2-polyfills.js">script>
    <script src="lib/angular2.dev.js">script>
    <script src="lib/Rx.js">script>
    <script src="lib/typescript.js">script>
    <script src="lib/tsloader.js">script>
    <script src="lib/router.dev.js">script>
    <script src="lib/http.dev.js">script>

head>
<body>
    <h1>属性绑定--[property]h1>
    <my-app>my-app>
    <script type="text/typescript">
    import {Component} from "angular2/core";
    import {bootstrap} from "angular2/platform/browser";

        @Component ({
            selector:"my-app",
            template:`

"color">我是标题</h1> ` }) class myApp{ constructor(){ this.color="red"; setInterval(()=>{ this.color='#'+parseInt(Math.random()*0xffffff).toString(16); },1000); } } bootstrap(myApp); script> body> html>

-constructor内代码可以更换其他写法

constructor(){
            this.color="red";
            var selfColor=this;
            setInterval(()=>{
    selfColor='#'+parseInt(Math.random()*0xffffff).toString(16);
    },1000); 
}

当然还可以用复杂一点的,红、绿、蓝三色随机取值后赋值给this.color

你可能感兴趣的:(angular2)