angular8
古兔bug
菜鸟快飞~~~
展开
-
promise
promise目的:1 避免回调地狱2 promise对象提供了简洁的API,使得控制异步操作更容易promise的三种状态:pendding: 正在请求reject: 失败resolved: 成功基础用法:const promise = new Promise(function(resolve,reject){if(reslove){}else{}}) resolve,reject函数:在异步状态pendding==》resolved回调成功时,通过调用resolved函数返回结果,原创 2020-09-25 10:18:11 · 123 阅读 · 0 评论 -
angular中@ViewChild 的三种常用方法
//--1------ 在angular中进行dom操作<div #dom>这是一个div</div> //放置一个锚点domimport { ElementRef, ViewChild } from '@angular/core';@ViewChild('dom',{static:true}), eleRef:ElementRef;//static-True表示在运行更改检测之前解析查询结果,false用于在更改检测后解析。默认为false。// dom 操作需要在原创 2020-08-04 17:20:43 · 3860 阅读 · 2 评论 -
angular8中,用html2canvas+jspdf 实现页面下载pdf(解决了中文问题和页边距问题)
下载jspdf 和 html2canvas:npm install jspdf --savenpm install html2canvas --save在当前使用 的ts文件中引入import * as jsPdf from ‘jspdf’import html2canvas from ‘html2canvas’import { Component, OnInit ,Input, Query} from '@angular/core';//引入生成pdf的插件import * as jsP原创 2020-07-27 18:25:47 · 1365 阅读 · 0 评论 -
angular页面跳转时,用get传值和动态路由跳转传值
前提在把路由跳转路线写好const routes: Routes = [ { path: 'bottom',component:BottomMuduleComponent }, { path: 'header',component:HeaderModuleComponent }, { path: 'main',component:MainMoudleComponent }, { path: 'slidebar',component:Slideba原创 2020-07-23 10:46:43 · 234 阅读 · 0 评论 -
angular中rxjs针对异步数据流的编程以及Observable的工具方法,promise的异步数据编程
在angular中,通用的方法一般放置在services.ts文件中在service文件中封装和处理异步的方法,在当前组件的ts中调用并取值获取异步数据方法:1 通过回调函数获取异步方法中的值2 通过promise3 通过rxjs4 了解rxjs中的工具函数map 和 filterservices.ts:import { Injectable } from '@angular/core';import { Observable, observable } from 'rxjs'@Inj原创 2020-07-22 12:19:55 · 254 阅读 · 0 评论 -
angular表单实现双向数据绑定
注意:实现表单双向数据绑定,必须先引入FormsModule包HTML:<h2 >人员登记表</h2><ul> <li>姓名: <input type="text" [(ngModel)]="peopleInfo.userName"> </li> <li> 性别: <input type="radio" value="1" name="sex原创 2020-07-19 20:34:52 · 605 阅读 · 0 评论 -
angular中的 ngClass和ngStyle
ngClass测试:HTML文件:<div [ngClass]="{red: flag}" [ngClass]="{blue: !flag}"> ngClass 测试</div>在ts文件中定义flag:public flag:boolen = true在sass文件中.red: color: red.blue: color: blue解析: 表示在HTML文件中用flag的true和false值来改变该文字的颜色flag在ts文件中定义值。ngSt原创 2020-07-18 23:05:06 · 214 阅读 · 0 评论 -
angular8里面的*ngSwitch
ts文件:定义一个类型:orderStatuspubulc orderStatus:number = 1// 1表示已经支付 2 表示支付成功 3 表示已经发货 4 表示已经收获货 5 表示无效html文件:<span [*ngSwitch]="orderStatus"></span><p *ngSwitchCase="1"> 表示已支付</p><p *ngSwitchCase="2"> 表示支付成功 </p>原创 2020-07-18 22:37:08 · 2053 阅读 · 0 评论