YUSIR 完美CODING世界

useEffect是不能直接用 async await 语法糖的

内容投影是一种模式，你可以在其中插入或投影要在另一个组件中使用的内容。简单来说，angular的内容投影就相当于vue的内容插槽slot。所有一下就能懂了。1、单插槽内容投影单插槽内容投影是指创建一个组件，你可以在其中投影一个组件。如果只有一个ng-content，不需要select属性。2、多插槽内容投影一个组件可以具有多个插槽。每个插槽可以指定一个 CSS 选择器，该选择器会决定将哪些内容放入该插槽。将select属性添加到<ng-content>元素。 Ang...

什么是依赖注入依赖注入（DI）是一种设计模式, 也有相应的框架，比如InversifyJSAngular 有自己的 DI 框架, DI 框架会在实例化该类时向其提供这个类所声明的依赖项带修饰符的参数在ts中，一个类的参数如果带上修饰符，那个参数就变成了类的实例属性class Mobile { constructor(readonly name: string = '小米') {} logName() { console.log(this.name); }}上面的name

从实例化组件，渲染组件模板时，各声明周期就已开始ngOnChanges输入属性发生变化是触发，但组件内部改变输入属性是不会触发的import { Component, Input, OnInit, OnChanges } from '@angular/core';@Component({ selector: 'app-life-cycle', templateUrl: ` 点击按钮不会触发ngOnChanges <button (click)="title = '

类提供者类提供者的创建和使用假设有logger类：import { Injectable } from '@angular/core';@Injectable()export class LoggerService { logs: string[] = []; constructor() { } log(message: string) { this.logs.push(message); console.log(message); }}类提供者，使用us

内置指令的展开写法ngIfimport { Component } from '@angular/core';@Component({ selector: 'app-root', template: ` <button (click)="show = !show">toggle</button> <p *ngIf="show as aa">一段文字 {{ aa }}</p> <ng-template [ngIf]="sho

基本概念用于改变DOM元素的外观或行为的指令组件是一种特殊的指令import {Component} from '@angular/core';@Component({ selector: 'app-root', template: ` <!--<app-for></app-for>--> <div app-for>dasfsada</div> `,})export class AppComponent {

ContentChild用法类似ViewChild, 获取投影中到组件或指令还有元素dom等获取投影中但组件import {AfterViewInit, Component, ElementRef, OnInit, ViewChild} from '@angular/core';@Component({ selector: 'app-content-child-panel', templateUrl: './content-child-panel.component.html'})ex

ViewChild最好在ngAfterViewInit之后，获取模版上的内容获取普通domimport {AfterViewInit, Component, ElementRef, OnInit, ViewChild} from '@angular/core';@Component({ selector: 'app-view-child', template: ` <section> <h3>获取dom</h3>

ElementRef由于ng是跨平台的为了减少视图层和渲染层的耦合也为了让ng更适应多平台，ng帮我们封装了ElementRef，我们可以通过ElementRef拿到native元素(在浏览器中也就是我们常说的DOM元素)下面我们看一段代码 import { Component, ElementRef, AfterViewInit } from '@angular/core'; @Component ({ selector:'my-app', t

显示数据1.显示数据ng的模版中，默认用双大括号{{}}绑定组件中的变量显示出来import { Component } from '@angular/core';@Component({ selector: 'app-root', template: ` <h1>{{title}}</h1> <h2>My favorite hero is: {{myHero}}</h2> `, styles: [`h1 { c

工作硬上开发angular项目，好难啊，上网搜资料教程真的贼少，吐槽真的没什么人用angular，自己学习到处搜集整理的笔记，分享出来，方便查看理解总结。应该适用于angular11系列（更新真快，反正我也不知道之前低版本不同 手动狗头）什么是angular module(ngModule)?angular module就是一个普通的类，但是这个类，一旦被@NgModule所装饰，那这个类就可以被称为angular module@NgModule元数据@NgModule 获取一个元数据对象，它会告

BehaviorSubject/* ehaviorSubject接受一个默认参数，相当于new Subject后自动next('aa') 之后到行为和Subject一致*/const behave = new BehaviorSubject('aa');behave.subscribe(res => { console.log(res); // aa bb});behave.next('bb');// 获取最新到值behave.getValue(); // 'bb'be

toArray/* toArray把结果都塞到数组里去*/const source = interval(1000);const example = source.pipe( take(10), toArray());example.subscribe(val => console.log(val));// output: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]toArray/* pairwise把相邻的两个流组成数组*/

Angular CLI 使用教程指南参考Angular CLI 现在虽然可以正常使用但仍然处于测试阶段. Angular CLI 依赖 Node 4 和 NPM 3 或更高版本.安装要安装Angular CLI你需要先安装node和npm，然后运行以下命令来安装最新的Angular CLI：注意：Angular CLI 需要Node 4.X 和 NPM 3.X 以上