Angular
文章平均质量分 51
yusirxiaer
前端移动端一路の风景
展开
-
ngrx学习笔记
什么是ngrx ngrx是Angular基于Rxjs的状态管理,保存了Redux的核心概念,并使用RxJs扩展的Redux实现。使用Observable来简化监听事件和订阅等操作。 在看这篇文章之前,已经假设你已了解rxjs和redux。 有条件的话请查看官方文档进行学习理解。 所需包 ng add方式,会自动生成所需文件并在app.module.ts中导入,直接启动项目即可,不报错 ng add @ngrx/store ng add @ngrx/store-devtools ng add @ng.原创 2022-02-13 15:27:23 · 2227 阅读 · 0 评论 -
Angular 内容投影 II
内容投影是一种模式,你可以在其中插入或投影要在另一个组件中使用的内容。 简单来说,angular的内容投影就相当于vue的内容插槽slot。所有一下就能懂了。 1、单插槽内容投影 单插槽内容投影是指创建一个组件,你可以在其中投影一个组件。如果只有一个ng-content,不需要select属性。 2、多插槽内容投影 一个组件可以具有多个插槽。每个插槽可以指定一个 CSS 选择器,该选择器会决定将哪些内容放入该插槽。将select属性添加到<ng-content>元素。 Ang...原创 2021-12-06 00:40:41 · 257 阅读 · 0 评论 -
angular 内容投影
app HTML <div class="wrapper"> <h2>我是父组件</h2> <div>这个div定义在父组件中</div> <app-child> <div class="header">这个div是父组件投影到子组件的1, {{title}}</div> <div class="footer">这个div是父组件投影到子组件的2</div>原创 2021-02-17 23:06:53 · 268 阅读 · 0 评论 -
@ViewChild 的三种常用方法
//--1------ 在angular中进行dom操作 <div #dom>这是一个div</div> //放置一个锚点dom import { ElementRef, ViewChild } from '@angular/core'; @ViewChild('dom',{static:true}), eleRef:ElementRef; //static-True表示在运行更改检测之前解析查询结果,false用于在更改检测后解析。默认为false。 // dom 操作需要.原创 2021-02-17 22:34:39 · 4403 阅读 · 1 评论 -
:host :host-context ::ng-deep详解
:host 与 ::ng-deep :host 表示选择当前的组件。 ::ng-deep 可以忽略中间className的嵌套层级关系。直接找到你要修改的className。 在使用一些第三方的组件的时候,要修改组件的样式。 这种情况下使用: :host ::ng-deep .className{ 新的样式...... } :host { background: #F1F1F1; overflow: hidden; padding: 24px;原创 2021-02-17 18:07:44 · 4414 阅读 · 4 评论