angular
文章平均质量分 56
以实战为线索,学习angular
卸载引擎
世上本没有码,搬的人多了便有了码。
展开
-
【Angular】在angular2的app.component.html中使用 *ngIf 更改路由出口router-outlet
如果使用*ngIf有条件地禁用和启用router-outlet。当一个router-outlet会被注册,无论你做什么,下一个router-outlet都不会响应router的变化。此时应该使用具名的路由出口,或者只使用一个路由出口。原创 2022-07-01 09:50:15 · 424 阅读 · 0 评论 -
【Angular】angular去除输入的空格,Angular自定义属性指令-禁止input框输入空格-以及删除复制内容中的空格(附有其他解决办法)
禁止输入空格,即当用户按下空格键时便阻止输入,但是如果只是这样,那么用户仍然可能使用粘贴的方式输入空格,所以这里同时在keyup事件中将所有空格替换了。原创 2022-06-23 16:09:02 · 1275 阅读 · 0 评论 -
【JS】js将页面下载为图片---angular2中使用html2canvas将数据导出为图片,并下载到本地
1、安装html2canvas官方网站https://html2canvas.hertzen.com/npm install --save html2canvas2、在需要的组件中引入html2canvasimport html2canvas from 'html2canvas';在HTML5中,download是```<a>标签```的新增属性,download属性能让我们指定浏览器下载文件时的默认名称,也就是在客户端重命名下载文件。将download属性添加到```<a>链接```上,当我原创 2022-01-19 14:49:53 · 743 阅读 · 0 评论 -
【Angular】Angular中管道的使用---匹配搜索结果中的关键词并高亮显示
【Angular】Angular中管道的使用---匹配搜索结果中的关键词并高亮显示原创 2022-01-14 14:10:18 · 365 阅读 · 0 评论 -
【Angular】angular范例写法汇总
【Angular】angular范例写法汇总:1. *ngIf与else2. angular图片加载路径3. tabView与router路由双向选中4. 蚂蚁zorro的nz-table点击选中行添加样式原创 2022-01-07 10:29:56 · 769 阅读 · 0 评论 -
【Angular】Angular使用HTTP的GET/POST下载流文件
正常情况下,通过window.location = url就可以下载文件。浏览器判断这个链接是一个资源而不是页面的时候,就会自动下载文件。原创 2021-12-03 16:55:16 · 2083 阅读 · 0 评论 -
【Angular】如何在angular的组件里面引入外部(局部)js文件
如何在angular的组件里面引入外部(局部)js文件原创 2021-09-09 08:18:49 · 804 阅读 · 0 评论 -
【Angular】Angular子组件接受参数时使用set、get
子组件或指令中的 `@Input() `装饰器表示该属性可以从其父组件中获取值。要想监视` @Input() `属性的变化,你可以使用 Angular 的生命周期钩子`OnChanges` 。但上述方法,对于接收到的值都是,收到就使用。如果想对接收到参数进行一些处理 ,或者是根据参数执行不同操作。这个时候可以使用set和get方法。原创 2021-07-22 09:34:57 · 1370 阅读 · 0 评论 -
【Angular】Angular中的数据交互(get/post/jsonp/axios)
Angular5.x之后使用get、post请求服务器数据使用的是HttpClientModule模块。1.get获取数据1、在app.module.ts中引入HttpClientModule模块并注入import {HttpClientModule} from '@angular/common/http';imports: [ BrowserModule, HttpClientModule]2、在用到的地方引入HttpClient并在构造函数中声明import {HttpClie.原创 2021-05-05 20:32:21 · 251 阅读 · 0 评论 -
【JS】Promise与RxJS处理异步
RxJS 是使用 Observables 的响应式编程的库,它使编写异步或基于回调的代码更容易。一、常见的异步编程方法回调函数事件监听/发布订阅PromiseRxJS二、Promise与RxJS处理异步对比Promise 处理异步:let promise = new Promise(resolve => { setTimeout(() => {resolve('promise timeout'); }, 2000); });promise.then(value =.原创 2021-05-05 19:49:16 · 328 阅读 · 0 评论 -
Angular中父子组件传值以及组件之间通讯
一、父组件给子组件传值1.子组件可以获取父组件的数据案例如:header在不同的页面由父页面决定显示标题父组件通过属性绑定给子组件传值,父组件中先定义了数据public msg:string='我是数据'。父组件中调用子组件模板,先由属性接收<app-header [msg]="msg"></app-header> (此时数据正由父传向子)子组件引入input模块(装饰器),import {Component,OnInit,Input} from '@angular/co原创 2021-05-05 16:31:41 · 1145 阅读 · 0 评论 -
【Angular】Angular中使用@ViewChild
Angular中使用ViewChild获取dom节点模板中给dom起一个名字<div #myBox>我是一个dom节点</div>在业务逻辑里面引入ViewChildimport {Component,OnInit,ViewChild} from '@angular/core'写在类里面 @ViewChild('myBox') myBox:any;在ngAfterViewInit生命周期函数里面获取domthis.myBox.nativeElement父组件中使用Vie原创 2021-05-05 15:05:14 · 377 阅读 · 0 评论 -
【Angular】Angular中的服务service与组件间通信
为什么需要使用服务?Angular的service是一个简单的TypeScript类,它封装了一些用于完成应用程序中特定任务的方法,例如从服务器获取数据或者向服务器发送数据。Angular中所有组件都可以调用服务中的方法,但是服务中无法调用组件的方法。组件不可直接调用其他组件的方法(组件之间可以父子组件传值),但是服务之间可以相互调用方法。Angular Service 具有以下的作用:用来将应用程序中的业务逻辑组件中的渲染逻辑分离用来在Angular应用中的多个组件之间共享数据让程序易于测试原创 2021-05-05 13:35:48 · 2027 阅读 · 0 评论 -
【Angular】angular环境搭建
1.安装前的准备1.1 安装node.js注意安装最新的稳定版本1.2 安装cnpmnpm安装较慢1.3 使用npm/cnpm安装angular/ cli此安装只需要安装一次就好了npm install -g @angular/clicmd中输入ng v 可以查看是否安装成功。2.创建angular项目2.1找到要创建项目的目录2.2创建项目ng new 项目名称也可以跳过npm i安装:ng new 项目名称 --skip-install , 再使用cnpm install安装依赖原创 2021-05-04 15:21:29 · 906 阅读 · 0 评论