随笔分类 -  Angular

8 父子传参-子向父传递
摘要：1 代码结构 2 myc04.component.html <p>myc04 works!</p> <!--emit():触发msgEvent中的函数，就是show()--> <button (click)="msgEvent.emit('赵云')">Test 1</button> <button 阅读全文
posted @ 2022-06-14 19:57 孝文 阅读(53) 评论(0) 推荐(0)
8 父子传参-父向子传递
摘要：1 代码结构 2 myc03.component.html <p>myc03 works!</p> <h3>name:{{name}}</h3> <h3>age:{{age}}</h3> <h3>老板：{{boss?.name}}-{{boss?.age}}-{{boss?.sex}}</h3> m 阅读全文
posted @ 2022-06-14 19:35 孝文 阅读(49) 评论(0) 推荐(0)
7 掌控子元素
摘要：1 代码结构 2 myc02.component.html <p>myc02 works!</p> <h4>{{name}}</h4> <h4>{{age}}</h4> myc02.component.html 3 myc02.component.ts import { Component, OnI 阅读全文
posted @ 2022-06-14 19:02 孝文 阅读(37) 评论(0) 推荐(0)
6 Angular页面生命周期
摘要：1 代码结构 2 app.component.ts import { Component } from '@angular/core'; @Component({ selector: 'app-root', templateUrl: './app.component.html', styleUrls 阅读全文
posted @ 2022-06-02 08:58 孝文 阅读(82) 评论(0) 推荐(0)
5 Angular-管道（自定义）
摘要：1 代码结构 2 myc02.component.ts 1 import { Component, OnInit } from '@angular/core'; 2 3 @Component({ 4 selector: 'app-myc02', 5 templateUrl: './myc02.com 阅读全文
posted @ 2022-05-15 20:35 孝文 阅读(54) 评论(0) 推荐(0)
5 Angular-管道（系统定义）
摘要：1 代码结构 2 myc01.component.html 1 <p>myc01 works!</p> 2 3 <!--pipe管道--> 4 <!--与vue不同：vue中的管道需要用户自己定制声明--> 5 <!--angular官方提供了一些常用的管道--> 6 <ul> 7 <li>大写：{ 阅读全文
posted @ 2022-05-14 22:58 孝文 阅读(53) 评论(0) 推荐(0)
4 Angular-自定义指令
摘要：1 代码结构 2 myc04.component.html 1 <p>myc04 works!</p> 2 3 <!--自定义指令--> 4 <div> 5 <input type="text"> 6 </div> 7 <div> 8 <!--自定义指令：ng generate directive 阅读全文
posted @ 2022-05-14 17:34 孝文 阅读(31) 评论(0) 推荐(0)
4 Angular-系统指令、自定义指令ngFor
摘要：1 代码结构 2 myc03.component.ts 1 import { Component, OnInit } from '@angular/core'; 2 3 @Component({ 4 selector: 'app-myc03', 5 templateUrl: './myc03.com 阅读全文
posted @ 2022-05-14 17:03 孝文 阅读(50) 评论(0) 推荐(0)
3 Angular-系统指令、自定义指令ngSwitch-ngSwitchCase
摘要：1 代码结构 2 myc02.component.ts 1 import { Component, OnInit } from '@angular/core'; 2 3 @Component({ 4 selector: 'app-myc02', 5 templateUrl: './myc02.com 阅读全文
posted @ 2022-05-14 16:46 孝文 阅读(88) 评论(0) 推荐(0)
2 Angular-系统指令、自定义指令ngIf
摘要：1 项目结构 2 myc01.component.ts 1 import { Component, OnInit } from '@angular/core'; 2 3 @Component({ 4 selector: 'app-myc01', 5 templateUrl: './myc01.com 阅读全文
posted @ 2022-05-14 16:40 孝文 阅读(43) 评论(0) 推荐(0)