angular常用

ng build --prod --aot 打包
import * as xxx from ‘xxx’: 会将若干export导出的内容组合成一个对象返回；
import xxx from ‘xxx’：只会导出这个默认的对象作为一个对象，
TS ？可选参数

interface IFRequestParam {
    url: string;
    msg?: string;
    config?: any;
    data?: any;
}

angular中的pipe是用来对输入的数据进行处理，如大小写转换、数值和日期格式化等。
使用 @Pipe 装饰器定义 Pipe 的 metadata 信息，如 Pipe 的名称 - 即 name
实现 PipeTransform 接口中定义的 transform 方法

//父子通訊
父 子
@ViewChild('tagInput') 变量类型为子组件类，可以使用子组件的方法等，同时触发钩子


ts代码：
@Input() address: Address;
子 父 和vue emit一樣
@Output()属性装饰器来实现。 实现步骤：首先需要在子组件中定义事件（使用EventEmitter方法），子组件的事件被触发时引发父组件的事件响应

// app.module.ts
@NgModule({
  ...
  providers: [MyService]
})
export class AppModule {}

//my-service.ts
import { Injectable } from '@angular/core';

@Injectable()
export class MyService {
  constructor() { }
}

//angular6+之后只要在service中申明  6之前需要在引用时 providers: [MyService]
@Injectable({
  providedIn: 'root',
})

 @Inject(MyService )注入//组件调用时使用    @Injectable()可注入//service内部  组件调用时要 @NgModule({providers: [MyService]})    @Injectable({providedIn: 'root',})  //service声明 且调用时不要申明 

 
 @Optional()
 @Inject(MyService )
 @Optional 表示可有可无, 如果没有使用 Optional, 在没有provider 而尝试注入 service 的情况下, angular 是会报错的哦.//@Inject(MyService )注入时使用

HostListener - 声明一个主机监听器。当主机元素发出指定的事件时，角色将调用装饰的方法。＃ HostListener -将听取主元素，@HostListener声明发出该事件。

HostBinding -声明主机属性binding.Angular在更改检测期间自动检查主机属性绑定。如果绑定发生变化，它将更新指令的主机元素。＃ HostBinding -将绑定属性Host元素，如果有约束力的变化，HostBinding将更新主机元素。

@Component({ changeDetection: ChangeDetectionStrategy.OnPush}), 监听change策略

@HostListener('mouseleave') 
mouseleave() {
   this.backgroundColor = 'white'; 
 }

https://juejin.im/post/597fe587518825563e037bd3(简介)

https://www.jianshu.com/p/fc96f60e5745（详解！）

Reactive Extensions for JavaScript基于可观测数据流在异步编程应用中的库

响应式编程（RP —— Reactive Programming）

响应式编程是一种面向数据流和变化传播的编程范式。在编程语言中很方便地表达静态或动态的数据流，而相关的计算模型会自动将变化的值通过数据流进行传播。—— wikipedia

响应式编程是使用异步数据流进行编程。常见的异步数据流包含Event buses。用包含这些事件在内的任何东西创建数据流（Data stream），监听他并作出响应。

只关注业务逻辑互相依赖的事件而不是实现细节

适用于大量和数据有关的事件交互，特别是高实时性要求

Functional Programming 基本观念

Functional Programming 是一种编程范式(programming paradigm)，就像 Object-oriented Programming(OOP)一样，就是一种写程式的方法论，这些方法论告诉我们如何思考及解决问题。

我们可以写成

const add = (a, b) => a + b
const mul = (a, b) => a * b
const sub = (a, b) => a - b
sub(add(5, 6), mul(1, 3))

我们把每个运算包成一个个不同的 function，并用这些 function 组合出我们要的结果，这就是最简单的 Functional Programming。
函数风格的编程特点：
第一等公民是函数
带有闭包的Lambdas/Anonymous函数
不变性，大部分无态处理，没有状态和变量
高并发
无副作用的调用
通过tail call实现递归的性能优化。
模式匹配(Haskell, Erlang)
懒赋值(Miranda, Haskell)
Homoiconicity(类似LISP)

Iterator(迭代器) 跟 Observer（观察者）两个 Pattern模式，这两个 Pattern 都是渐进式的取得元素，差异在于 Observer 是靠生产者推送资料，Iterator 则是消费者去要求资料，而 Observable 就是这两个思想的结合

//Iterator Pattern
class IteratorFromArray {
    constructor(arr) {
        this._array = arr;
        this._cursor = 0;
    }

    next() {
        return this._cursor < this._array.length ?
        { value: this._array[this._cursor++], done: false } :
        { done: true };
    }

    map(callback) {
        const iterator = new IteratorFromArray(this._array);
        return {
            next: () => {
                const { done, value } = iterator.next();
                return {
                    done: done,
                    value: done ? undefined : callback(value)
                }
            }
        }
    }
}

var iterator = new IteratorFromArray([1,2,3]);
var newIterator = iterator.map(value => value + 3);

newIterator.next();
// { value: 4, done: false }
newIterator.next();
// { value: 5, done: false }
newIterator.next();
// { value: 6, done: false }

angular常用

你可能感兴趣的:(angular常用)