angular.json简单解释
Angular 工作空间 指的是 一个 由Angular CLI创建,并且能够包含多个项目 或者 由单一文件导出配置的库 的目录空间。
angular.json的配置文件,这个文件是整个项目的概要,包含了 不同的环境,测试、代理、第三方资源 和 众多内置工具。
angular.json
$schema
JSON Schema 是一个允许我们注解和验证JSON数据格式的工具。An ...
Angular架构概述
Angular 是一个用 HTML 和 TypeScript 构建客户端应用的平台与框架。 Angular 本身就是用 TypeScript 写成的。它将核心功能和可选功能作为一组 TypeScript 库进行实现,你可以把它们导入你的应用中。
Angular 的基本构造块是 NgModule,它为组件提供了编译的上下文环境。 NgModule 会把相关的代码收集到一些功能集中。Angul ...
Angular有哪些版本?
目前Angular有7个版本,分别为:Angularjs、Angular2、Angular4、Angular5、Angular6、Angular7、Angular8。下面本篇文章就来给大家介绍一下,希望对大家有所帮助。
版本1
Angularjs是一款由Google维护的开源JavaScript库,用来协助单一页面应用程序运行。它的目标是透过MVC模式(MVC)功能增强基于浏览器的 ...
Angular怎么防御xss攻击?
跨站点脚本(XSS)攻击是一种注入类型,其中恶意脚本被注入到其他良性和可信赖的网站中。那么Angular怎么防御xss攻击?
当攻击者使用Web应用程序将恶意代码(通常以浏览器端脚本的形式)发送给不同的最终用户时,就会发生XSS攻击。允许这些攻击成功的缺陷非常普遍,并且发生在Web应用程序在其生成的输出中使用来自用户的输 ...
Angular路由复用策略RouteReuseStrategy
第一步
新建RouteReuseStrategy
新建一个CustomReuseStrategy.ts 实现接口 RouteReuseStrategy
import { RouteReuseStrategy, ActivatedRouteSnapshot, DetachedRouteHandle } from '@angular/router';
export class CustomReuseStrategy implements RouteReuseStrategy {
public static handlers: { [key: stri ...
Angular 状态管理方案调研
1 / 状态管理
Rxjs + Service 组件内管理状态:在组件中可以声明一个属性,作为组件的内存存储。每次操作时调用服务(service)中的方法,然后手动更新状态。
export class TodoComponent {
todos : Todo[] = []; // 在组件中建立一个内存TodoList数组
constructor(
@Inject('todoService') private service, ...
Angular项目目录结构详解
目录结构:
首层目录:
node_modules 第三方依赖包存放目录
e2e 端到端的测试目录 用来做自动测试的
src 应用源代码目录
.angular-cli.json Angular命令行工具的配置文件。后期可能会去修改它,引一些其他的第三方的包 比如jquery等
karma.conf.js karm ...
angular中使用ngFor循环数字
在vue 中存在用v-for循环数字的的方法,快速生成由1递增到指定数字的数组,通常用以创建页码。
但angular中的ngFor无法实现这样的效果,记录一下在angular项目中手动封装分页组件时需要这种情况的做法:
<ul>
<li *ngFor="< span style="color: #ff0000; font-size: 15px;" data-mce-style="color: #ff0000; font-size: ...
angular解决跨域问题
在进行项目开发过程中,经常会遇到跨域问题,下面就通过一些配置进行解决跨域问题。
1.在项目根目录下进行创建文件 proxy.config.json;
{
"/": {
"target": "", //要指向的域名或端口号
"logLevel": "debug", //
"secure": false, //
"changeOrigin": true, //
"path ...
angular material 使用步骤
tips:默认你已经安装了必备步骤 如angular npm
1、首先在你的电脑上安装angular
npm install my-app
2、angular 安装成功之后安装material
npm install --save @angular/material @angular/cdk @angular/animations
npm install --save @angular/flex-layout
在app.module.ts中导入BrowserAni ...
使用Angular 10 创建Web Component全解析
摘要:使用原生js,html,css封装web component比较麻烦,在angular 10.0中,提供了一种使用angular elements把angular component转换成web component的能力。
这是一篇介绍如何使用angular创建web component的文章。
你将会看到:
使用angular创建web component的原理
如何使用angular创建web component
新建angular工 ...
Angular(二) - 组件Component
1. 组件Component示例
2. Component常用的几个选项
3. Component全部的选项
3.1 继承自@Directive装饰器的选项
3.2 @Component自己特有的选项
4. 自定义component
1. 组件Component示例
组件是由一个装饰器@Component来声明的,继承自@Directive
import {Component} from '@angular/core';
@Component({
selector ...
Angular(一) - Typescript&Angular入门熟悉
1. Typescript
1.1 安装typescript
1.2 typescript的小例子
1.2.1 新建一个index.ts
1.2.2 编译ts成js
1.2.3 查看生成的index.js
1.2.4 运行javascript
1.3 typescript的一些特性
2. Angular
2.1 Angular Cli的安装
2.2 创建项目
2.3 安装依赖并启动
2.4 文件目录树
1. Typescript
1.1 安装typescript
全局安装t ...
Angular 之我见
很久没有写过技术软文了,虽然 Angular 发布已有四年,得到了越来越多人的关注及认可,但是仍然有很多人不分青红皂白的进行诋毁。我打算结合自己的经历从客观的角度聊一聊我眼中的 Angular。
本人刚做前端接触的是 jQuery,对 MVVM 库和框架知之甚少,且身边没有独当一面的大牛引领,全靠视频教程和自己的摸索。后来做新项 ...
angular httpClient大全
引入来自it营
Angular5.x 以后 get、post 和和服务器交互使用的是 HttpClientModule 模块。
使用步骤:
1、在 app.module.ts 中引入 并注入
import {HttpClientModule} from '@angular/common/http';
imports: [
HttpClientModule
]
2、在你需要用的组件中引入HttpClient 并在构造函数中声明
import {Http ...
echarts配置一个中间显示文字的环形图
先贴一张效果图
1.导包
我没有用什么框架,直接引入echarts.min.js文件,代码如下:
<script src="./js/echarts.min.js"></script>
注意这样引入不要放在header标签里,会阻塞html渲染,导致报错。
2.给echarts一个盒子
<div id="angular" class="everySkill"></div>
3.配置环 ...
Angular拦截请求和响应
什么是HTTP_INTERCEPTORS?
一个多重提供商(multi-provider)令牌,它代表所有已注册的HttpInterceptor构成的数组
const HTTP_INTERCEPTORS: InjectionToken<HttpInterceptor[]>;
什么是HttpInterceptor?
拦截HttpRequest并处理它们
interface HttpInterceptor {
intercept(req: ...
企业项目实战 .Net Core + Vue/Angular 分库分表日志系统六 | 最终篇-通过AOP自动连接数据库-完成日志业务
教程
01 | 模块化方案一
02 | 模块化方案二
其他教程预览
分库分表项目实战教程
Git地址: https://github.com/MrChuJiu/EasyLogger
01 | 前言
02 | 简单的分库分表设计
03 | 控制反转搭配简单业务
04 | 强化设计方案
05 | 完善业务自动创建数据库
06 | 最终篇-通过AOP自动连接数据库-完成日志业务
前言
这周比较忙 ...
企业项目实战 .Net Core + Vue/Angular 分库分表日志系统二 | 简单的分库分表设计
教程
01 | 模块化方案一
02 | 模块化方案二
其他教程预览
分库分表项目实战教程
Git地址: https://github.com/MrChuJiu/EasyLogger
01 | 前言
02 | 简单的分库分表设计
03 | 控制反转搭配简单业务
04 | 强化设计方案
05 | 完善业务自动创建数据库
06 | 最终篇-通过AOP自动连接数据库-完成日志业务
前言
项目涉及到 ...
企业项目实战 .Net Core + Vue/Angular 分库分表日志系统一 | 前言
教程
01 | 模块化方案一
02 | 模块化方案二
其他教程预览
分库分表项目实战教程
Git地址: https://github.com/MrChuJiu/EasyLogger
01 | 前言
02 | 简单的分库分表设计
03 | 控制反转搭配简单业务
04 | 强化设计方案
05 | 完善业务自动创建数据库
06 | 最终篇-通过AOP自动连接数据库-完成日志业务
介绍
大家好我是 ...