angular 整理

2023-11-10

文章目录


参考

https://www.cnblogs.com/wjw1014/p/10262309.html


网址

npm

package.json来制定名单,需要哪些npm包来参与到项目中来,npm install命令根据这个配置文件增减来管理本地的安装包。

dependencies(项目依赖库):在安装时使用–save则写入到dependencies
和devDependencies(开发依赖库):在安装时使用–save-dev将写入到devDependencies
node_modules文件里的依赖全部安装:npm install
node_modules文件里的依赖只安装dependencies:npm install --production
node_modules文件里的依赖只安装devDependencies:npm install packagename --dev

知识点

  • 声明式组件是通过组件声明的selector加载;
  • 入口组件(entry component)是通过组件的类型动态加载;
    入口组件是通过指定的组件类加载组件。主要分为三类:
    • 在@NgModule.bootstrap里声明的启动组件,如AppComponent。
    • 在路由配置里引用的组件
    • 其他通过编程使用组件类型加载的动态组件

npm install -g ts-node // 安装 ‘ts-node’
npm install -g typescript
npm install -g @angular-devkit/schematics-cli

npm install -g @angular/cli
npm install -g @angular/cli@x.x.x

ng new todo-lists

ng update --help
ng update
ng update @angular/core

ng serve

ng generate
ng g m about – 生成一个about module
ng g c about --module about – 生成一个about 组件,放入about 模块中
ng g c todo --module app – 生成一个about 组件,放入about 模块中

ng build – 打包,默认输出到 dist 目录
ng build --prod 对应 angular.json 配置文件

angular.json
prefix

模块
component directive pipe
根据功能划分
应用模块就是对应用类零散的组件、指令、服务等按照功能进行归类包装;
同模块的指令可以相互使用同模块的组件,跨模块的不可以。

@ngModule
selector : 使用组件的时候使用什么样的元素选择器中括号表示指令使用在元素属性上,
declaration : 组件 指令 pipe
import: 模块输入
exports : 输出
bootstrap: 一般在根模块下声明,指定应用启动时从那个模块进行启动
provides
一个component 只能属于一个moudle

main.ts

组件
就是一个普通的es6 class
@component 装饰器,就是元数据

*ngFor {{item.xxx}}
(click)="xx"   -- 圆括号代表输出,输出一个click事件,模板向组件发送事件
属性绑定-[value]  :把组件类的数据传递到组件模板中。
事件绑定-(keyup) :把模板产生的数据通过函数调用传递到组件类。
双向绑定-[(ngModel)] :实现数据双向流动。

输入、输出

Pipe
格式化数据

装饰器 – 注解
就是个函数,在代码编译的阶段修改类的行为;如下例,代码编译时,会将T传入add,修改T行为

@Add('go')
class T {}

function Add(prop: any) {
  return function (target: any) {
    target['prop'] = true;
    return target;
  }
}

console.log(T);

直接运行ts
ts-node xxx.ts
tsc decorator.ts

路由
import { RouteModule } from ‘@angular/router’

url路径是xxx 的时候,加载某个 component

RouterModule.forRoot();
RouterModule.forChild();

<router-outlet></router-outlet> 是个指令,路由发生变化时渲染,就是放到哪儿

routerLink='url' routerActive="css 的类,需要在css 中定义"

服务
服务是实现专一目的的逻辑单元,如日志服务。

响应式表单
FormControl FormGroup FormBuilder


问题:
@Input() 输入

属性或参数中使用 ?:表示该属性或参数为可选项
属性或参数中使用 !:表示强制解析(告诉typescript编译器,这里一定有值),常用于vue-decorator中的@Prop
变量后使用 !:表示类型推断排除null、undefined


在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

angular 整理 的相关文章

随机推荐

  • 【蚁群算法栅格图路径规划python】

    蚁群算法栅格图路径规划python 简单说几句 python代码 0 预安装库 1 调用模版 2 地图文件 3 栅格图 迭代图 3 ACO类 简单说几句 简单说几句 算法的基本逻辑请看其他文章 很多 不介绍 本文旨在提供一份python代码
  • WSL 错误 System has not been booted with systemd as init system (PID 1). Can‘t operate

    描述 项目 描述 操作系统 Windows 10 专业版 版本 WSL 2 前情 在 适用与 Linux 的 Windows 的子系统 WSL 默认情况下是无法使用 systemctl 命令 使用该命令 WSL 将抛出如下错误 System
  • pyinstaller打包exe文件

    pyinstaller是一个python第三方库 可以安装 用于打包py脚本文件成exe可执行程序给其他人使用 而不是需要python解释器执行py脚本 指令如下 pyinstaller F w py文件目录 F是只生成一个EXE文件 w是
  • 文字滚动

    不用JavaScript 不开定时器也可以实现文字滚动的效果 仅仅需要用一对
  • java 异常就是出错?快醒醒吧

    1 异常是什么 首先异常 Exception 和错误 Error 并不能划等号 顾名思义 它只是程序运行出现了不正常的情况 2 异常的家族 从图中我们可以看出Error和Exception属于一个家族的两兄弟 Exception中又分为两类
  • 关于RedisTemplate和StringRedisTemplate

    最近在开始在学习Redis以及如何在Java当中去使用Redis Redis是什么我这里就不说了 我主要想说的是Redis和Java当中Spring结合起来的时候 使用到的RedisTemplate和StringRedisTemplate
  • pycharm读取图片

    把图片整体存入数据库 encoding utf 8 import pymysql conn pymysql connect host 127 0 0 1 port 3306 user root passwd root db test sql
  • JS 取出某数组前n位的数据

    别再用 for 循环了 用 splice arr arr splice 0 n
  • 【Android】ViewBinding+DataBinding+MVVM新手快速上手

    为什么写这篇博客 网上大部分博客 代码量都比较大 把实际的业务都代入进去了 这篇博客的目的 就是为了讲解基本原理和使用思路 然后给出一个最简单的Demo 这里不讲解具体用法 那样篇幅会太长 直接看Demo代码就行 什么是ViewBindin
  • SFP光模块接口说明

    SFP光模块接口说明 1 引脚定义 Pin Name Function Description 1 VeeT 发射部分地 2 TX Fault 发射部分报错 3 TX Disable 关断发射 高电平或悬空有效 4 MOD DEF2 模块定
  • pclint检查linux代码,linux pclint

    这个插件只是分析已经生成的报告 并非去检查代码 比如配置的规则中有cppcheck库的 那么运行sonar runner时只会读取你用cppcheck检查后生成的问题报告 我也遇到过同样的问题 我是这样解决的 1 要先安装cppcheck工
  • 利用Github搭建自己专属博客

    这是一个在Windows简易的搭建博客的方法 建立使用Jekyll构建自己的博客 所以这一篇文章采用fork别人的模板来构建 偷懒 在此之前需要满足一下条件 注册一个Github账号 本地安装Git 并且能实现Git向自己的仓库push文件
  • minikube 实战篇 - 镜像打包部署 - 1

    实战篇 镜像打包 如果你是一个JAVA开发人员 需要把spring项目部署到minikube中 该怎么操作是一个需要探索的问题 这篇文章会讲解如何打包部署项目 1 生成demo项目 在浏览器端输入https start spring io
  • 第9章 Stata聚类分析

    目录 9 1划分聚类分析 1 数标准化处理 2 K个平均数的聚类分析 3 K个中位数的聚类分析 案例延伸 1 采用其他相异性指标 2 设置聚类变量的名称 3 设置观测样本为初始聚类中心 4 排除作为初始聚类中心的观测样本 9 2层次聚类分析
  • gdb 常用命令

    run r 运行 运行带参数的可执行文件 r 后面接参数 例如 gdb executablefile gdb r arg1 arg2 arg3 continue c 继续运行 next n 单步运行 step s 如果有函数则进入函数执行
  • Python 列表推导式、矩阵、格式化输出

    列表推导式 列表推导式提供了从列表 元组创建列表的简单途径 语法 表达式 for语句 if语句 创建并返回一个列表 if语句可选 示例 list1 1 2 3 4 使用元组也行 list2 x 2 for x in list1 print
  • Node.js 学习系列(四)—— 回调函数

    Node js 异步编程的直接体现就是回调 异步编程依托于回调来实现 但不能说使用了回调后程序就异步化了 回调函数在任务完成后就会被调用 Node 使用了大量的回调函数 Node 的所有 API 都支持回调函数 例如 我们可以一边读取文件
  • 【干货】dockerfastdfs集群

    正文 最近整理了一份 Netty 相关的文档干货 讲解很系统 今天分享给大家 看完这份文档你将获得哪些收获 理解当下火热的 Netty 框架 核心概念 开发流程 手写 RPC 框架 聊天室 Tomcat等 对照知识点进行查漏补缺 帮助扫除知
  • 类 AudioInputStream 说明文档 中文版

    javax sound sampled 类 AudioInputStreamjava lang Object java io InputStream javax sound sampled AudioInputStream 所有已实现的接口
  • angular 整理

    文章目录 网址 npm 知识点 参考 https www cnblogs com wjw1014 p 10262309 html 网址 angular https angular cn docs ag grid https www ag g