![](https://img-blog.csdnimg.cn/20201014180756925.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
Angular
strong90
在程序猿的道路上,越来越猿~~
展开
-
angular 反向代理,网络访问
{ "/api/": { "target": "http://******/api/", "changeOrigin": true, "secure": false, "pathRewrite": { "^/api": "" } }}根目录添加 proxy.config.json,如果遇到404的情况,记得加上"changeOrigin": true, 就可以了package.json 中添加,然后...原创 2020-09-09 18:00:23 · 350 阅读 · 0 评论 -
angular 组件通知
原文地址:https://segmentfault.com/a/1190000011425280注意:现在的场景是这样的,界面是由N多个组件组成的,如果一个组件中修改了接口的内容,其他组件需要调接口刷新数据,那么就用到了EventEmitter1、创建服务,new一个EventEmitterimport {Injectable, EventEmitter, OnInit} from "@angul...转载 2018-07-07 12:54:48 · 1410 阅读 · 0 评论 -
angular5 子组件监听父组件传入值的变化
项目中遇到一个问题,就是在ngInit()中调用方法,只调用一次的问题,当父组件传值变化时,并不会再次执行(ps:csdn又抽风了,代码格式被清除了)。import {Component,Input,OnChanges,SimpleChanges} from '@angular/core';import {NavController} from 'ionic-...原创 2018-07-25 11:10:04 · 5891 阅读 · 4 评论 -
angular2.x 截取视频第一帧代码
原创 2018-08-01 10:01:06 · 498 阅读 · 0 评论 -
angular 强制刷新
1. 引入模块import { Component, ViewChild, NgZone} from '@angular/core';2. 声明constructor( public ngZone: NgZone) { } }3.使用 this.ngZone.run(() => { // 需要强...原创 2018-08-10 10:11:00 · 5830 阅读 · 1 评论 -
angular5 下拉加载更多
做到一个web聊天,需要制作一个类似下拉分页的功能,大致思路如下:1. 安装插件 ngx-infinite-scroll2. <div #chatScroll scrollSpyElement="chat" class="chat-detail c-scroll-y-a message-wrap"infinite-scroll[infiniteScrollDistanc...原创 2018-08-07 13:26:35 · 1758 阅读 · 0 评论 -
HTML input 输入限制
1.只能输入数字和英文的:<input onkeyup="value=value.replace(/[/W]/g,'') "onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^/d]/g,''))"ID="Text1" NAME="Text1">2.只能输入数字...原创 2018-10-11 16:57:42 · 4489 阅读 · 0 评论 -
angular+ng-zorro-antd 一些资料地址记录
web文档地址:https://ng.ant.design/docs/introduce/zhgithub地址:https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/README-zh_CN.md mobile 文档地址:http://ng.mobile.ant.design/#/docs/introduce/zhg...原创 2018-10-24 13:32:21 · 598 阅读 · 0 评论 -
angular http 拦截器
import { Injectable } from '@angular/core';import { HttpEvent, HttpInterceptor, HttpHandler, HttpRequest, HttpResponse, HttpErrorResponse } from '@angular/common/http';import { Observable, throwErr...原创 2019-04-02 10:46:22 · 1905 阅读 · 0 评论 -
angular 获取当前路由(ps:侧边栏选中状态在网页刷新后消失)
import { Component, OnInit, Input } from '@angular/core';import { MenusService } from '../../../core/menus/menus.service';import { PlatformLocation } from '@angular/common'@Component({ selector...原创 2019-04-12 14:32:07 · 884 阅读 · 0 评论 -
360浏览器强制使用极速模式
360浏览器强制使用极速模式<meta name="renderer" content="webkit">原创 2019-04-26 15:30:22 · 3056 阅读 · 0 评论 -
angular 使用ckplayer注意
原作者demo地址:https://github.com/bainana/angular-ckplayer-demo下载ckplay:http://www.ckplayer.com/down/angular工程使用ckplay 放入到assets 中typings.d.ts 中(没有需要自己创建)declare var ckplayer: any;angular.json...原创 2019-05-22 14:46:41 · 802 阅读 · 0 评论 -
ng-zorro中G2图片柱状图切换数据显示异常
当切换数据时,需要先 clear,再赋值this.chart21 = new G2.Chart({ container: 'grid21', forceFit: true, height: 400, padding: 'auto', //padding: [20, 40, 40, 50], animate: true});//...原创 2019-07-17 10:26:44 · 1068 阅读 · 0 评论 -
angular2+,路由跳转后保持页面始终在顶部
import { NgModule } from '@angular/core';import { Routes, RouterModule } from "@angular/router";const routes: Routes = [ }];@NgModule({ imports: [ PassportModule, PasswordModule, ...原创 2019-07-30 16:21:01 · 807 阅读 · 0 评论 -
angular 监听网页关闭
import { Component } from '@angular/core';import { TranslateService } from "@ngx-translate/core";@Component({ selector: 'app-root', templateUrl: './app.component.html', styleUrls: ['./app.co...原创 2019-08-08 16:08:59 · 4312 阅读 · 0 评论 -
promise 链式用法,拒绝多层异步地狱回调
1. 传统回调地狱用法getData('http://******').then(res => { console.log('第一次成功回调'); getData('http://******').then(res => { console.log('第二次成功回调'); getData('http://****...原创 2019-08-12 17:45:44 · 264 阅读 · 0 评论 -
angular5 自动滚动到最底部
The Component:import {..., AfterViewChecked, ElementRef, ViewChild, OnInit} from 'angular2/core'@Component({ ...})export class ChannelComponent implements OnInit, AfterViewChecked { @ViewCh...翻译 2018-07-11 15:00:55 · 3420 阅读 · 0 评论 -
ng2-file-upload
在Github上找到了一个支持Angular4好用的文件上传组件ng2-file-upload,这里简单介绍一下这个库的集成使用方案。 本文基于该组件的1.2.1版。1. 安装安装非常简单,只要在项目根路径下运行如下npm命令即可:npm install ng2-file-upload --save2. 使用说明官方的文档写的非常简单,几乎看不出什么来,这里结合实际的使用调试,说明一下基本的配置和...转载 2018-07-03 16:28:34 · 1228 阅读 · 0 评论 -
Angular组件之间的交互
转载地址:https://www.cnblogs.com/nangxi/articles/7630579.htmlAngular组件之间的交互分为:1.通过输入型绑定把数据从父组件传到子组件。2.通过setter截听输入属性值的变化3.通过ngOnChanges()来截听输入属性值的变化4.父组件监听子组件的事件5.父组件与子组件通过本地变量互动6.父组件调用@ViewChild()7.父组件和子...转载 2018-05-29 09:24:28 · 471 阅读 · 0 评论 -
Angularjs--自定义树形结构视图
原文地址:http://www.cnblogs.com/sxz2008/p/6555706.html在层次数据结构展示中,树是一种极其常见的展现方式。比如系统中目录结构、企业组织结构、电子商务产品分类都是常见的树形结构数据。这里我们采用Angular的方式来实现这类常见的tree view结构。首先我们定义数据结构,采用以children属性来挂接子节点方式来展现树层次结构,示例...转载 2017-09-05 15:40:08 · 2330 阅读 · 1 评论 -
ionic--遇到URL中包含中文解决办法
// url包含中文转码 function encodeUrlFromChinese (url) { return encodeURI(url); }原创 2017-10-11 10:25:32 · 1248 阅读 · 1 评论 -
微信清除缓存的办法
微信缓存解决办法:第一种:在引入的文件中添加版本号 第二种:修改url http://xxxxxxx?version=20171027原创 2017-10-27 14:56:57 · 527 阅读 · 0 评论 -
高德地图ios11 定位失败
ios11 系统 微信公众号 高德地图定位失败类似 Chrome 等浏览器框架目前禁止非 https 环境进行定位,请在iOS11下尝试访问如下页面:1、可以成功定位的页面地址:http://a.amap.com/jsapi_demos/static/remogeo/remo.html2、需要引入的remogeo.js ,本地新建一个js文件,将以下网址内容添加进去,htt...原创 2017-10-26 16:01:18 · 7650 阅读 · 5 评论 -
compass mac 安装失败
使用以下命令安装:sudo gem install -n /usr/local/bin compass原创 2017-12-08 14:29:24 · 301 阅读 · 0 评论 -
angularjs 插入富文本 不显示视频
$scope.trustHtml = $sce.trustAsHtml(富文本);原创 2017-12-13 16:45:27 · 635 阅读 · 0 评论 -
angularjs checkbox
angularjs checkbox 的选中与不选中,与ng-model绑定,而不是ng-checked或者checkedinput(type="checkbox"ng-model="checked")原创 2017-12-17 11:26:11 · 413 阅读 · 0 评论 -
angular 便捷版取消数据关联
$scope.obj.verifyDataList = angular.fromJson(angular.toJson($scope.verifyClass)); angular2 以后:JSON.parse(JSON.stringify(data)); 思想就是用json转一下, 改变指向地址原创 2018-01-05 14:19:56 · 165 阅读 · 0 评论 -
angular 无法识别ngFor,ngIf can't bind解决
1、app.module里面 import { BrowserModule } from '@angular/platform-browser';imports: [BrowserModule,]2、每个单独的module的里面引入import { CommonModule } from '@angular/common';imports: [CommonModule]...原创 2018-04-09 09:12:48 · 5638 阅读 · 2 评论 -
angular4.x 路由嵌套
以下为非root-route中的代码:部分代码地址:https://github.com/oceankai/angular4-demo/tree/master/tab-demo1、需要嵌套的二级路由const routes: Routes = [ { path: '', redirectTo: 'home' }, { path: 'home', component: HomeC...原创 2018-04-10 17:56:42 · 1288 阅读 · 0 评论 -
angular4 页面传递参数
1. 一级页面 editMsg(id) { let navigationExtras: NavigationExtras = { queryParams: { 'id': id } }; this.router.navigate(['/x-service/cemetery-type-edit'], navigationExtras); }2. 二级页面 ngOnI...原创 2018-04-11 14:44:04 · 2611 阅读 · 1 评论 -
ngbModal open()参数传递
ngbModal open()参数传递子页面import { Component, Output, EventEmitter } from '@angular/core';export class AppModalComponent { private data: string; @Output emitService = new EventEmitter(); con...原创 2018-04-17 15:45:00 · 3994 阅读 · 1 评论 -
Angular4.x 各种坑持续更新
1、如果ngFor 或者 ngIf等指令不识别,请在路由中引入,且加入import { CommonModule } from '@angular/common';@NgModule中imports:[CommonModule]2、如果下拉框等不出现,需要引入import { BsDropdownModule } from 'ngx-bootstrap/dropdown';3、ngbModal o...原创 2018-04-13 10:01:56 · 683 阅读 · 0 评论 -
ng2-image-cropper的使用
//our root app componentimport {Component, NgModule, ViewChild} from '@angular/core'import {BrowserModule} from '@angular/platform-browser'import {ImageCropperComponent, CropperSettings, Bounds} from ...翻译 2018-04-23 18:47:57 · 1985 阅读 · 0 评论 -
Angular4 父组件监听子组件数据变化
// 引入import { ......, OnChanges, SimpleChanges } from '@angular/core';// 获取更新的变化 ngOnChanges(changes: SimpleChanges) { console.log('changes---',changes); }原创 2018-05-29 09:23:13 · 4062 阅读 · 0 评论 -
Angularjs指令directives
今天主要来说说AngularJS的三个指令“ @ ”,“ = ”,“ & ”的用法和区别(这个问题困扰了我大半天,和Frank交流多次,我才明白)1.指令作用域中的@作用是把当前属性作为字符串传递。先上代码,前台界面:JS代码:var myModule = angular.module("MyModule", []);转载 2017-08-25 13:38:42 · 560 阅读 · 0 评论