- 博客(20)
- 收藏
- 关注
RSS订阅原创 30 天精通 RxJS 笔记4
文章目录Observable OperatorObservable Operatorskip：可以略过前几个送出的元素，但是原本元素的等待时间仍然存在takeLast：必须等到整个observable完成(complete)，才能知道最后的元素有哪些，并且同步送出last：takeLast(1)的简化写法，那就是last()用来取得最后一个元素。concat：把多个observable 实例合并成一个，必须先等前一个observable完成(complete)，才会继续下一个startWith
2020-11-29 20:31:34
120
原创 30 天精通 RxJS 笔记3
文章目录Observable Operators & Marble Diagrams什麼是 Operator？Marble diagrams（弹珠图）Operators简易拖拉实作- take, first, takeUntil, concatAllOperators简易拖拉Observable Operators & Marble Diagrams什麼是 Operator？Operators 就是一個個被附加到 Observable 上的函数，例如像是 map, filter, …
2020-11-28 18:34:11
152
原创 30 天精通 RxJS 笔记2
文章目录建立 Observable(一)建立ObservableObservable 同時可以處理同步與非同步的行為觀察者 Observer訂閱一個 Observable 就像是執行一個 function建立 Observable(二)常用Creation OperatorSubscription建立 Observable(一)建立Observableconst { Observable } = rxjs;var observable = Observable .create((observer)
2020-11-28 15:23:25
109
原创 30 天精通 RxJS 笔记1
文章目录认识RxJS函数式（Functional）编程响应式（Reactive）编程小结函数式（Functional）编程基本概念核心思想基本条件优势认识RxJS函数式（Functional）编程用 function 来思考问题，以及编写程序。响应式（Reactive）编程当变量发生改变时，由变量主动告诉我发生变动了。小结RxJS是函数式编程和响应式编程两种编程思想的结合。函数式（Functional）编程基本概念核心思想做运算处理，并用Function来思考问题。基本条件函数能够
2020-11-28 11:20:58
153
原创 Angular 笔记12（表单与用户输入——响应式表单、验证表单、动态表单构建）
响应式表单响应式表单概述响应式表单对表单状态的每一次变更都会返回一个新的状态，这样可以在变化时维护模型的整体性。响应式表单是围绕 Observable 流构建的，表单的输入和值都是通过这些输入值组成的流来提供的，它可以同步访问。此篇只记录需要注意的知识点，官方文档（中文版）更详细显示表单控件的值通过可观察对象 valueChanges，你可以在模板中使用 AsyncPipe 或在组件类中使用 subscribe() 方法来监听表单值的变化。使用 value 属性。它能让你获得当前值的一份快
2020-11-15 23:23:36
1054
原创 Angular 笔记11（表单与用户输入——简介）
文章目录简介选择一种方法关键差异可伸缩性建立表单模型建立响应式表单建立模板驱动表单表单中的数据流响应式表单中的数据流模板驱动表单中的数据流 （没看懂）数据模型的可变性简介Angular 提供了两种不同的方法来通过表单处理用户输入：响应式表单和模板驱动表单。 两者都从视图中捕获用户输入事件、验证用户输入、创建表单模型、修改数据模型，并提供跟踪这些更改的途径。选择一种方法响应式表单提供对底层表单对象模型直接、显式的访问。更加健壮：它们的可扩展性、可复用性和可测试性都更高。模板驱动表单依赖模板中的指令
2020-11-15 12:12:57
213
原创 Angular 笔记10（组件与模板——动态组件）
动态组件创建锚点：在添加组件之前，先要定义一个锚点来告诉 Angular 要把组件插入到什么地方。使用一个自定义辅助指令来在模板中标记出有效的插入点。import { Directive, ViewContainerRef } from '@angular/core';@Directive({ selector: '[ad-host]',})export class AdDirective { constructor(public viewContainerRef: ViewCont
2020-11-14 20:54:07
403
原创 Angular 笔记9（组件与模板——组件样式）
组件样式使用组件样式@Component({ selector: 'app-root', template: ` <h1>Tour of Heroes</h1> <app-hero-main [hero]="hero"></app-hero-main> `, styles: ['h1 { font-weight: normal; }']})export class HeroAppComponent {/* . . .
2020-11-14 18:28:58
314
原创 Angular 笔记9（组件与模板——组件交互）
文章目录组件交互通过输入型绑定把数据从父组件传到子组件通过 setter 截听输入属性值的变化通过ngOnChanges()来截听输入属性值的变化父组件监听子组件的事件父组件与子组件通过本地变量互动父组件调用@ViewChild()（重要）组件交互通过输入型绑定把数据从父组件传到子组件父组件：import { Component } from '@angular/core';import { HEROES } from './hero';@Component({ selector: 'ap
2020-11-14 11:05:10
408
原创 Angular 笔记8（组件与模板——生命周期）
文章目录生命周期钩子响应生命周期事件生命周期的顺序生命周期钩子响应生命周期事件生命周期的顺序ngOnChanges()：当 Angular 设置或重新设置数据绑定的输入属性时响应。 该方法接受当前和上一属性值的 SimpleChanges 对象。（与Vue中的watch和computed类似）ngOnInit()：在 Angular 第一次显示数据绑定和设置指令/组件的输入属性之后，初始化指令/组件。在第一轮 ngOnChanges() 完成之后调用，只调用一次。ngDoCheck()：检测，
2020-11-13 20:30:13
1492
原创 Angular 笔记6（组件与模板3）
组件与模板用户输入绑定用户输入事件@Component({ selector: 'app-click-me', template: ` <button (click)="onClickMe()">Click me!</button> {{clickMessage}}`})export class ClickMeComponent { clickMessage = ''; onClickMe() { this.clickMessage
2020-11-11 22:41:33
170
原创 Mapbox 笔记4（数据）
数据使用 Tilequery API 创建一个健康食物查询器要点添加地理编码器通过地理编码器查找周边符合条件的点数据渲染查询后的数据点使用 Mapbox GL JS 制作一张热力图要点
2020-11-10 20:07:34
803
原创 Mapbox 笔记2（Web应用——构建商店定位器）
文章目录Web应用使用 Mapbox GL JS 构建商店定位器实现思路第一种 加载内置标签初始化地图加载商店geojson数据创建商店列表添加事件监听（商店列表点击事件和地图点击事件）添加交互（flyToStore方法和createPopUp方法）第二种 加载自定义标签添加商店geojson数据创建商店列表（略）添加自定义Marker添加事件监听（商店列表点击事件和Marker点击事件）Web应用使用 Mapbox GL JS 构建商店定位器实现思路初始化地图加载商店geojson数据创建商
2020-11-08 18:42:22
449
原创 Angular 笔记5（组件与模板2）
文章目录组件与模板模板语法模板引用变量（ #var ）输入和输出属性如何使用 @Input()（`相当于Vue中的props`）如何使用 @Output()（`相当于Vue中的this.$emit()`）@Input() 和 @Output() 在一起@Input() 和 @Output() 声明为输入和输出指定别名模板表达式中的运算符管道运算符（ | ）安全导航运算符（ ? ）和空属性路径非空断言运算符（!）组件与模板模板语法模板引用变量（ #var ）模板引用变量通常是对模板中 DOM 元素的引
2020-11-08 12:35:58
141
原创 Angular 笔记4（组件与模板1）
文章目录组件与模板显示数据使用插值显示组件属性选择模板来源*ngFor 指令*ngIf 指令为数据创建一个类模板语法插值与模板表达式插值表达式组件与模板显示数据使用插值显示组件属性选择模板来源使用 @Component 装饰器的 template 属性来定义内联模板。内联模板对于小型示例或测试很有用。@Component({ selector: 'app-root', template: ` <h1>{{title}}</h1> <h2>
2020-11-08 09:58:04
207
原创 Angular 笔记2（Angular 范例应用）
文章目录快速上手范例应用组件交互路由注册路由使用路由信息数据服务概念创建服务启用HttpClient在 AppModule 中为应用启用 HttpClient在服务中使用 HttpClient表单部署本地构建发布快速上手范例应用组件交互创建子组件右键单击 app 文件夹，使用 Angular Generator 生成一个名为 product-alerts 的新组件。父传子子传父路由注册路由使用路由信息数据服务概念服务是 Angular
2020-11-04 09:53:59
779
原创 Angular 笔记3（英雄指南）
文章目录快速上手教程：英雄指南管道双向绑定CSS类绑定Observable（RxJS）路由添加 AppRoutingModule添加路由出口 RouterOutlet添加路由链接 (routerLink)路由类型获取带参数的路由回退服务端请求数据启用HTTP服务HttpClient返回数据错误处理HTTP修改数据HTTP添加数据HTTP删除数据http Options优化搜索操作异步管道快速上手教程：英雄指南管道双向绑定[(ngModel)] 是 Angular 的双向数据绑定语法。使用双向绑
2020-11-04 09:51:42
176
原创 Angular 笔记1（Angular基本概念）
文章目录快速上手搭建环境Angular的基本概念模块组件服务与依赖注入模块简介@NgModule 元数据Angular 自带的库组件简介组件的元数据模板语法数据绑定管道指令结构型指令属性型指令服务与依赖注入简介服务范例依赖注入提供服务快速上手搭建环境安装 Angular CLInpm install -g @angular/cli创建工作空间和初始应用ng new my-app运行应用ng serve --open–open（或者只用 -o 缩写）选项会自动打开你的浏览器
2020-11-04 09:50:24
343
原创 Mapbox 笔记1（Mapbox 是如何工作的）
文章目录初步了解MapboxMapbox 是如何工作的Access TokenToken的使用范围URL 限制创建和管理 access token创建新数据geojson数据格式创建数据集数据集转换为 tileset初步了解MapboxMapbox 是如何工作的Access Token需要获取 access token（访问令牌）以使用 Mapbox 的各种工具、API、SDK。Token的使用范围每个 access token 都可以限制Mapbox API的使用范围。在选择 token 范围
2020-11-01 12:20:21
2008
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人