angular5/6
关注
分享
扫一扫
文章平均质量分 56
蒙奇·D·伊丽莎白
这个作者很懒，什么都没留下…
展开
-
Angular2+ NgModule
一、@NgModule@NgModule()语句描述本模块的元数据。declarations：声明属于本模块的组件，每个组件必须在且仅在一个模块中声明。 imports:引入买本模块中用到的模块，该模块是处于import语句引入的模块中。 providers:声明模块中使用的服务的提供者，暂时还没有用到。 bootstrap:根模块中的引导组件，应用启动过程中，会创建这个数组中的...原创 2018-08-23 15:38:26 · 374 阅读 · 0 评论 -
angular2+ Component
import语句导入需要的模块。 使用@Component()来描述本组件的元数据。 selector:创建的组件的名字，就像HTML标签的名字一样 templateUrl: HTML模板，使用相对路径，./表示这个组件文件所在的当前目录， styleUrls:HTML模板使用的样式表，可以有多个。 最后，使用export创建组件的类并暴露出去。在类中，可以创建属性和方法。...原创 2018-08-23 15:52:41 · 303 阅读 · 0 评论 -
angular2+ 复用组件
一、新建SharedModule一、新建公共组件SqModelComponent三、在其他模块使用的时候不用导入这些公共组件，只需要导入公共模块即可SharedModule四、使用有用文章：https://segmentfault.com/q/1010000011540335/a-1020000011542369https://www.cnblogs.c...原创 2018-08-23 16:35:35 · 1841 阅读 · 0 评论 -
There is no directive with "exportAs" set to "ngbDatepicker"
问题：ngb-boostrap日历控件There is no directive with "exportAs" set to "ngbDatepicker" https://github.com/ng-bootstrap/ng-bootstrap/issues/2433 NgbModal' imported by the module 'HomeModule'. Please...原创 2018-08-24 16:30:16 · 2221 阅读 · 0 评论 -
angular 管道/过滤器@Pipe
参考文章：https://angular.cn/guide/pipeshttps://blog.youkuaiyun.com/Neokekeke/article/details/78750036原创 2018-09-12 09:34:15 · 662 阅读 · 0 评论 -
material.angular使用
先上图： 官网：https://material.angular.io/guide/getting-started 一、安装插件：npm install --save @angular/material @angular/cdk @angular/animationsnpm install --save hammerjs二、导入： 1、ang...原创 2018-09-06 19:11:14 · 1110 阅读 · 0 评论 -
angular路由的两种策略
路由器通过两种 LocationStrategy 提供商来支持所有这些风格： PathLocationStrategy - 默认的策略，支持“HTML 5 pushState”风格。 HashLocationStrategy - 支持“hash URL”风格。 对比两种策略：link你必须选择一种策略，并且在项目的早期就这么干。一旦该应用进入了生产阶段，要改起来可就不容易了...转载 2018-09-25 15:15:18 · 1624 阅读 · 0 评论 -
angular路由跳转页面后刷新报404错误
服务器环境: nginx 问题：刷新请求页面时，nginx 等服务器会先于angular接管页面跳转，由于nginx并没有 angular里的路由，因此会报错。解决：nginx 配置：try_files $uri $uri/ /index.html =404; #这里一定要设置http://www.cnblogs.com/wawahaha/p/4641691.ht...原创 2018-09-25 15:17:39 · 2213 阅读 · 0 评论 -
rxjx@^5.0.0版本与rxjx@^6之比较
一、RxJS 库创建可观察对象的函数Observable creation functionsRxJS 提供了一些用来创建可观察对象的函数。这些函数可以简化根据某些东西创建可观察对象的过程，比如事件、定时器、承诺等等。比如：操作符Operators操作符是基于可观察对象构建的一些对集合进行复杂操作的函数。RxJS 定义了一些操作符，比如 map()、filter()、con...原创 2018-10-11 10:46:27 · 469 阅读 · 0 评论 -
jwt
一、java jwt https://github.com/jwtk/jjwthttps://jwt.io/introduction/ https://auth0.com/docs/jwthttps://www.cnblogs.com/vhyc/p/7953779.html https://www.cnblogs.com/yueguanguanyun/p/905...原创 2018-10-09 11:10:03 · 236 阅读 · 0 评论 -
angular 模块懒加载 与 预加载策略
一、模块懒加载 1、RouterModule.forRoot() 和 RouterModule.forChild()RouterModule对象为提供了两个静态的方法:forRoot()和forChild()来配置路由信息。RouterModule.forRoot()方法用于在主模块中定义主要的路由信息，RouterModule.forChild()与 Router.forRoo...原创 2018-11-28 15:20:52 · 5330 阅读 · 0 评论 -
angular前端性能优化
一、启动时间优化 打包文件main. bundle .js是把所有模块自己编写的js都打包到一块；vendor.bundle.js包含了angular的公共库。 优化： vendor.bundle.js使用打包命令ng build --prod --aot 代替 ng build--prod 代表生产环境编译，带有代码混淆与压缩功能。--aot 代表预编译，会显著...原创 2018-11-28 15:51:01 · 1859 阅读 · 0 评论 -
XXX项目web技术总结
目录1 软件安装... 31.1 git 31.2 node. 31.3 VSCode. 32 angular开发版本... 33 项目目录结构... 34 使用css预处理：sass. 44.1 配置sass 45 ...原创 2018-12-21 10:49:41 · 953 阅读 · 0 评论 -
构建通用的angular项目
源代码参考https://github.com/xif3681/angular-seed先决条件在开始之前，请确保你的开发环境已经包含了Node.js®和 npm 包管理器。Node.jsAngular 需要Node.js的 8.x 或 10.x 版本。要想检查你的版本，请在终端/控制台窗口中运行node -v命令。 要想安装Node.js，请访问node...原创 2019-03-28 16:23:07 · 485 阅读 · 0 评论 -
Angular纯前端实现table表格导出excel的xls格式
版本：angular版本5.2.0插件：filesaver1.3.8方法：首先npm安装filesavernpm install file-saver --save然后直接在表格所属的component中，不是module，是在componet中引入，代码如下：component.tsimport { saveAs } from "file-saver";//方法...转载 2018-08-30 17:23:44 · 3472 阅读 · 2 评论 -
Ng-Bootstrap 折叠（Collapse）插件制作侧边栏导航菜单
Collapse：https://github.com/Foxandxss/ngbs-demo/tree/5ae300e64ad0afd59dad2921dd1e6b517e9652d3/demo/src/app/components/collapsets:import { NgbCollapse } from'@ng-bootstrap/ng-bootstrap';htm...原创 2018-07-04 18:23:48 · 7432 阅读 · 0 评论 -
Ng-bootstrap下拉菜单NgbDropdown
html: <div ngbDropdown class="d-inline-block"> <button class="btn btn-outline-primary" id="dropdownBasic1" ngbDropdownToggle>Toggle dropdown</button> ..原创 2018-07-17 15:57:36 · 1308 阅读 · 0 评论 -
angular5工作要点总结
网站地址：http://www.sdiid.com.cn/代码：https://github.com/xif3681/job2-1-angular5-SDIID一、angular开发版本angular-cli: V1.7.3angular: V5.2.0typescript: V2.5.3webpack: V3.11.0node: V8.X二、项目目录结构三...原创 2018-06-29 16:11:48 · 915 阅读 · 2 评论 -
angular组件通信
1.路由传递参数a.ts:import { Router } from '@angular/router';export class HomeComponent { constructor( public router: Router) { } // 路由跳转-传递参数-这是在html中绑定的click跳转事件 jumpHandle(item) { t...原创 2018-07-23 15:56:01 · 316 阅读 · 0 评论 -
angular 路由切换->滚动条的位置如何回到顶部
问题：angular 路由切换浏览器记住滚动条的位置解决：import { Component, OnInit } from '@angular/core';import { Router } from '@angular/router';declare var $: any;@Component({ selector: 'app-root', templateUrl:...原创 2018-07-23 14:47:41 · 3335 阅读 · 1 评论 -
angular使用font-awesome
font-awesomehttp://www.fontawesome.com.cn/get-started/ 使用 CSS复制 font-awesome 目录到你的项目中 在<head>处加载font-awesome.min.css如下。<linkrel="stylesheet"href="path/to/font-awesome/css/font-aw...原创 2018-07-04 16:25:10 · 1714 阅读 · 0 评论 -
ng-bootstrap Type 'ElementRef' is not generic.
原因：angular版本是5.X,angular-cli版本是6.X导致ng-bootstrap版本和angular版本不匹配最新版本ng-bootstrap支持最新版本的angular，目前为angular6 "@ng-bootstrap/ng-bootstrap": "^2.2.0", 解决问题： 1.ng-bootstrap版本回退"@ng...原创 2018-07-04 10:46:39 · 1655 阅读 · 0 评论 -
Angular5/6 rxjs has noexported member 'of
Angular5将：import { Observable, of } from'rxjs';改成：1． import { Observable } from'rxjs/Observable';2． import { of } from'rxjs/observable/of'; Angular5:import { Observable } from'rxjs';im...原创 2018-07-04 10:28:23 · 608 阅读 · 0 评论 -
Angular5 && Angular6类型“Observable<Response>”上不存在属性“map”
Angular5：类型“Observable<Response>”上不存在属性“map”，引入：import 'rxjs/add/operator/map'; Angular6：https://github.com/angular/angular/issues/15548#issuecomment-387009186import { map } from"...原创 2018-07-04 10:25:00 · 5538 阅读 · 7 评论 -
ionic3 app 开发要点总结
web网址：http://zhengtu.siid.com.cn/git地址：https://github.com/xif3681/job2-2-ionic3-zhengtu 开发坏境 Angular+Ionic+Cordova开始步骤网站： http://ionicframework.com/getting-started/官网css组件： http://ionicfram...原创 2018-06-29 15:59:48 · 1196 阅读 · 0 评论 -
npm install -g angular/cli error: Unsupported platform for fsevents@1.2.4
问题：npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.4 (node_modules\@angular\cli\node_modules\fsevents):npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@...原创 2018-08-07 15:43:28 · 4708 阅读 · 0 评论 -
angular6开发环境代理设置
1.添加proxy.config.json文件2.启动项目ng s --proxy-config proxy.config.json3.常见问题--使用错误命令命令1:npm start --proxy proxy.config.jsonnpm WARN invalid config proxy="proxy.config.json"npm WARN invali...原创 2018-08-03 15:28:15 · 2103 阅读 · 0 评论 -
Property binding ngForOf not used by any directive on an embedded template.
问题描述：Property binding ngForOf not used by any directive on an embedded template. Make sure that the property name is spelled correctly and all directives are listed in the "@NgModule.declarations"...原创 2018-08-01 15:29:36 · 2967 阅读 · 0 评论 -
Can't bind to 'options' since it isn't a known property of 'gridster'
问题：解决：To allow any element add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component.import { NgModule, NO_ERRORS_SCHEMA } from '@angular/core';这句话一定要放在出现问题的component属于的module上才起作用...原创 2018-08-01 14:42:07 · 4302 阅读 · 0 评论 -
百度地图自定义覆盖物
先上图：自定义覆盖物类（第一个例子）：气泡覆盖物css实现气泡：// 气泡.tag-bule{ width: 28px; height: 28px; line-height: 28px; text-align: center; border-radius: 50%; border: 5px solid #e8f0f5...原创 2018-07-25 17:19:03 · 757 阅读 · 0 评论 -
百度地图InfoWindow添加点击事件
要点：1.给InfoWindow添加元素时记得加上id2.获取对应的id,添加点击事件 效果图：原创 2018-07-25 17:06:53 · 7441 阅读 · 1 评论 -
angular-网站发布
测试服务器************一、打包：ng build --prod --aot二、服务器环境搭建1.安装ngnix2.配置ngnix3.验证nginx配置文件:./nginx -t4.启动ngnix启动代码格式：nginx安装目录地址 -c nginx配置文件地址/usr/local/nginx/...原创 2018-09-25 16:05:39 · 276 阅读 · 0 评论