组件:

vue组件:xxx.vue

react组件:xxx.js+xxx.css

angular组件:xxx.ts+xxx.css+xxx.html

angular的装饰器:

@ngModule:angular的一个模块化。装饰angular的app.module.ts文件内的AppModule类。

参数:

declarations:注册组件的地方
imports:注册项目用到的核心功能模块
providers:注册相关服务的
bootstrap:指定页面上初始渲染的组件


angular的组件装饰器:

@Component({
selector: 'app-root', //组件的名字
templateUrl: './app.component.html',//当前组件的html模板
styleUrls: ['./app.component.css'] //当前组件的样式
})
export class AppComponent {
title = 'angularpro';  //类的属性
}

通过@component这个装饰器,将AppComponent类装饰为一个组件。

vue和react和angular的html模板的区别:
vue和react必须要有一个根节点,但angular不需要根节点。

angular学习—组件的更多相关文章

  1. Angular 学习笔记 (动态组件 & Material Overlay & Dialog 分析)

    更新: 2019-11-24  dialog vs router link refer : https://stackoverflow.com/questions/51821766/angular-m ...

  2. Angular 学习思路

    近些年前端框架非常多,主流的有 Vue.React.Angular 等.我参与的项目中使用较多的是 Vue.因为 Vue 学习难度不大,上手很快,代码简洁,而且使用 Vue 全家桶(Vue + Vue ...

  3. Angular学习资料大全和常用语法汇总(让后端程序员轻松上手)

    前言: 首先为什么要写这样的一篇文章呢?主要是因为前段时间写过一些关于Angualr的相关实战文章,有些爱学习的小伙伴对这方面比较感兴趣,但是又不知道该怎么入手(因为认识我的大多数小伙伴都是后端的同学 ...

  4. angular学习资源

    angular学习资源   angularjs库: https://developers.google.com/speed/libraries/devguide?hl=zh-CN#angularjs ...

  5. angular学习一框架结构认识

    angular学习所有内容均会与vue以及react框架进行对比. angular学习使用的编译器:webstorm 解决编译器屏蔽node_modules包问题: File-->setting ...

  6. Angular 父子组件传值

    Angular 父子组件传值 @Input  @Output  @ViewChild 新建一个头部组件 newsheader 在主组件引用 news 组件,在news组件添加 newsheader 组 ...

  7. iCOM组件(iComponent,应用或学习组件)

    iCOM(英文全称:i + component,应用或学习组件,或iCOM组件),为学习资源的一种表现形式,是面向不同类型的学习对象(某一知识点或某一类知识点,如词汇.句子)专门开发的.在外部可重用的 ...

  8. angular学习笔记(三十一)-$location(2)

    之前已经介绍了$location服务的基本用法:angular学习笔记(三十一)-$location(1). 这篇是上一篇的进阶,介绍$location的配置,兼容各版本浏览器,等. *注意,这里介绍 ...

  9. angular学习笔记(三十一)-$location(1)

    本篇介绍angular中的$location服务的基本用法,下一篇介绍它的复杂的用法. $location服务的主要作用是用于获取当前url以及改变当前的url,并且存入历史记录. 一. 获取url的 ...

随机推荐

  1. MySql 主从同步 (库名不同)

    主库:192.168.1.250 从库:192.168.1.199 主库  my.ini # For advice on how to change settings please see # htt ...

  2. Girls and Boys HDU - 1068 二分图匹配(匈牙利)+最大独立集证明

    最大独立集证明参考:https://blog.csdn.net/qq_34564984/article/details/52778763 最大独立集证明: 上图,我们用两个红色的点覆盖了所有边.我们证 ...

  3. 2010 SD - ICPC D - Emergency

    D - Emergency Time Limit:1000MS     Memory Limit:65536KB     64bit IO Format:%lld & %llu Submit  ...

  4. 【AtCoder078D】Fennec VS. Snuke

    AtCoder Regular Contest 078 D - Fennec VS. Snuke 题意 给一个树,1是白色,n是黑色,其它没有颜色.Fennec每次可以染白色点的直接邻居为白色.Snu ...

  5. android startActivityForResult 使用实例

    ActivityForResult.java public class ActivityForResult extends Activity { Button bn; EditText city; @ ...

  6. 【转】使用STM32F4的CCM内存

    我们知道STM32F4当中有个CCM内存,如图所示,这个内存是挂在D总线上直接和内核相连,因此除了内核之外谁都不能访问,那么我们怎么将其利用起来呢?网上这个资料还真的很少,今天我就给大家分享一下,献给 ...

  7. luogu3292 幸运数字 (点分治+线性基)

    首先第一眼是一个倍增套线性基,但是$O(Qlog^2Vlog^N)=10^{10}$的复杂度... 即使是st表也只是变成了$O(Nlog^2Vlog^N)$啊 考虑点分治,相对于倍增显著减少了线性基 ...

  8. luogu1608 路径统计 (spfa)

    题意:给一个有向图(无零边),要求找出最短路的数量(重边只计算一次) 做spfa的时候,记一个cnt对于u-w->v如果dis[u]+w=dis[v],cnt[v]+=cnt[u] 如果dis[ ...

  9. Thinkphp5 captcha扩展包安装,验证码验证以及点击刷新

    首先下载 captcha扩展包,↓ 下载附件,解压到vendor目录下: 然后进入application/config.php添加配置信息: //验证码       'captcha'  =>  ...

  10. 构造器引用和直接用new创建对象区别

    万事用事实说话 package cn.lonecloud; /** * @author lonecloud * @version v1.0 * @date 上午11:22 2018/4/30 */ p ...