前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >Angular2 组件的使用

Angular2 组件的使用

作者头像
用户1437675
发布2018-08-20 11:02:57
1.5K0
发布2018-08-20 11:02:57
举报
文章被收录于专栏:Angular&服务Angular&服务
创建组件需要三步:

1.从 @angular/core 引入 Component 装饰器

2.创建一个类,并用 @Component 修饰

3.在 @Component 中 ,设置selector、template 和 styles 等元数据

代码语言:javascript
复制
import {Component} from '@angular/core';

@Component({
      selector: 'app-root',
      //template: '<p>Hello, {{name}}</p>'
      templateUrl: './app.component.html',
      styleUrls: ['./app.component.css']
})

export class Hello {
    name: string;

    constructor() {
        this.name = 'World';
    }
}

<b>selector (选择器):</b> 我们用它来告诉Angular创建和插入这个组件实例的元素属性。

<b>templateUrl(模版地址):</b> HTML的一种形式,它告诉Angular如何呈现这个组件。

<b>template (模板):</b> HTML的一种形式,它告诉Angular如何呈现这个组件。

<b>styleUrls(模版样式地址):</b> css样式,在组件模版中引用的css样式。


<h6 align = "right">sivona</h6>

本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
原始发表:2017.05.23 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 创建组件需要三步:
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档