当前位置： 首页 > article >正文

1.angular介绍

article 2026/3/1 7:49:18

初級使用视频添加链接描述

angular工具

angular.module(‘名’, [依赖模块]) 模块
angular.bind(*) : 修改this指向
angualr.copy() // a = angular.copy(a, b) —a完全覆盖了b,c就是a
angular.extend(a, b) a里面集成了b属性
angular.isArray
angular.isDate
angular.isDefined 判断是否存在如果不是undefined,跟下面相反
angular.isUndefined
angular.isFunction
angular.isNumber
angular.isObject
angular.isString
angular.isElement
angular.version 版本
angular.equals 这个数组相等,nan相等
angular.forEach(values, function(value, key) {this.push(value)}, result) var result = [] values可以是数组和对象, 里面的this就是第三个参数,也就是result
angular.fromJson/toJson({}, true) // 跟JSON.stringfy那种一样,只不过变成json的时候加第二个参数true就可以格式好一些
angular.element 其实后期就可以转化成jquery这种后面使用jquery方法
angular.bootstrap 可以动态变成angular,不用初始写ng-app,需要时候在变
angular.identity/noop 其实就是返回一样的和返回undefined,平常没用

其他的就看api就行

模块的属性m1= angular.module

m1属性

  • m1.controller 控制器.写js逻辑,里面[]注入的一般是服务MVUR有$scope,$timeout(在里面使用settimeout不起作用需要使用这个timeout才行)
  • m1.run 可以弄一個全局的，不用写控制器就可以的用的
    m1.run([‘$rootScope’, function($rootScope) {
    $rootScope.name = ‘hello’
    }])
  • m1.filter 过滤器
  • m1.directive 自定义指令
  • m1.factory() 自定义服务写公共使用的
  • m1.provider() 也是自定义服务,但是跟上面factory区别,factory不可以初始化服务也就是不可以.config
  • m1.service面向对象

过滤器

自有的過濾器

  • currency: ‘￥’ biancheng变成金额
  • number: 变成数字,后面number:2 2表示小数点两位
  • lowercase/uppercase 大小写转化
  • 变成json,<pre>{{ obj |json }}<pre> 格式变成json
  • limitTo:2 截取数组或字符串2位
  • date: ** 后面可以有参数可选把毫秒格式化’223212123’|date
  • order: ‘age’ : true数组根据age进行排序, 第二个参数可以逆排序
  • filter {{name|filter :‘l’: true}}过滤数组,比如数组中匹配value值匹配到l的值,第二个参数是匹配完整的value
    也可以多個使用
    eg
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body ng-app="myApp" ng-controller="Aaa"><!-- 19,721,389 --><span>{{ name|number:0 }}</span> <!-- HE --><span>{{ str|limitTo: 2|uppercase}}</span><script src="./public/angular.js"></script><script>var m1 = angular.module('myApp', [])m1.controller('Aaa', ['$scope', function($scope) {$scope.name = 19721389.132143$scope.str = 'hello'}])</script>
</body>
</html>

可以使用服务形式$filter

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body ng-app="myApp" ng-controller="Aaa"><!-- HELLO --><span>{{ name }}</span><!-- 32221.99 --><span>{{ num }}</span><script src="./public/angular.js"></script><script>var m1 = angular.module('myApp', [])m1.controller('Aaa', ['$scope', '$filter', function($scope, $filter) {$scope.name = $filter('uppercase')('hello')$scope.num = $filter('number')(32221.9932, 2)}])</script>
</body>
</html>

自定义过滤器.模块方法兩種寫法

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body ng-app="myApp" ng-controller="Aaa"><!-- Hello --><span>{{ name }}</span><!-- Hello --><span>{{ lalal | firstUpper: 2 }}</span><script src="./public/angular.js"></script><script>var m1 = angular.module('myApp', [])m1.controller('Aaa', ['$scope', '$filter', function($scope, $filter) {$scope.name = $filter('firstUpper')('hello')$scope.lalal = 'hello'}])m1.filter('firstUpper', function() {return function(str, num) {console.log(num) // 2return str.charAt(0).toUpperCase() + str.substring(1)}})</script>
</body>
</html>

注意

{{}} : 表达式 对于属性来说,如果原生的egclass=“{{}}” 使用变量就需要加{},如果是ng-这种比如 ng-value="*"直接变量名就行ng-class和ng-style,如果直接表达式{}这个就行,平时原生的基本就是{{}}, ng-指令形式的就基本是变量不用加{{}} ,如果不起作用在试试别种形式

<li ng-repeat="data in dataList" class="{{$odd? 'active1': 'active2'}}">{{data}}{{$odd}}</li>
<input type="button" ng-value="text" ng-disabled="IsDisabled">
<input type="text" ng-value="text" ng-readonly="IsDisabled">
<input type="checkbox" ng-checked="IsDisabled">
<span ng-class="{active: true}" ng-style="{color: 'yellow'}">{{ text }}</span><span ng-style="ngStyle">{{ text }}</span><a ng-href="{{ngHerf}}">qubaidu</a> // 这个就需要用{{}}

相关文章：

1.angular介绍

初級使用视频添加链接描述 angular工具 angular.module(‘名’, [依赖模块]) 模块 angular.bind(*) : 修改this指向 angualr.copy() // a angular.copy(a, b) —a完全覆盖了b,c就是a angular.extend(a, b) a里面集成了b属性 angular.isArray angular.isDate angular.isDefin…...

编程日记 2026/2/17 10:26:31

java项目40分钟后token失效问题排查（40分钟后刷新页面白屏）

项目40分钟后token失效问题排查&#xff08;40分钟后刷新页面白屏&#xff09; 经过我 对比失效前token 可以正常访问接口&#xff0c;失效后的token 不能访问系统&#xff0c; 得出结论&#xff0c;我系统对接第三方 sso 系统&#xff0c;token 失效时间 在他们那边配置&…...

编程日记 2026/2/24 2:33:47

音频进阶学习二十——DFT离散傅里叶变换

文章目录 前言一、FT、FS、DTFT、DFS1.FT和FS2.DTFT和DFS 二、DFT定义1.对于DFT的理解1&#xff09;DTFT和DFT2&#xff09;DFS和DFT3&#xff09;有限长序列和周期序列 2.圆周卷积1&#xff09;线性卷积2&#xff09;圆周卷积 三、频率采样和插值恢复1.频率采样的影响2.频率采…...

编程日记 2026/2/15 19:16:21

【Rust】集合的使用——Rust语言基础16

文章目录 1. 前言2. Vector2.1. 构建一个 vector2.2. 获取 vector 中的元素2.3. 遍历 vector2.4. 使用枚举来储存多种类型 3. String3.1. 新建字符串3.2. 更新字符串3.3. 字符串的内部结构3.3.1. 字符串如何访问内部元素&#xff1f;3.3.2. 字节、标量值和字形簇 3.4. 字符串 s…...

编程日记 2026/2/14 21:16:41

centos 7 部署ftp 基于匿名用户

在 CentOS 7 上搭建基于匿名用户的 FTP 服务&#xff0c;可按以下步骤进行&#xff1a; 1. 安装 vsftpd 服务 vsftpd 是一款常用的 FTP 服务器软件&#xff0c;可使用以下命令进行安装&#xff1a; bash sudo yum install -y vsftpd2. 启动并设置开机自启 vsftpd 服务 bash …...

编程日记 2026/2/17 7:35:12

Apache SeaTunnel脚本升级及参数调优实战

最近作者针对实时数仓的Apache SeaTunnel同步链路&#xff0c;完成了双引擎架构升级与全链路参数深度调优&#xff0c;希望本文能够给大家有所启发&#xff0c;欢迎批评指正&#xff01; Apache SeaTunnel 版本 &#xff1a;2.3.9 Doris版本&#xff1a;2.0.6 MySQL JDBC Conne…...

编程日记 2026/2/20 9:13:33

算法 | 优化算法比较

===================================================== github：https://github.com/MichaelBeechan CSDN：https://blog.csdn.net/u011344545 ===================================================== 优化算法 ‌一、主流优化算法分类‌1‌、传统梯度类算法‌2‌、启发式算…...

编程日记 2026/2/17 4:12:37

破局 MySQL 死锁：深入理解锁机制与高效解决方案

死锁的原理 1. 什么是死锁&#xff1f; 当 多个事务 在并发执行时&#xff0c;每个事务都 持有其他事务需要的锁&#xff0c;同时又在 等待对方释放锁&#xff0c;导致所有事务都无法继续执行的状态&#xff0c;称为 死锁&#xff08;Deadlock&#xff09;。 2. 死锁的四个必要…...

编程日记 2026/2/23 7:59:11

学习记录-cssjs-综合复习案例（二）

目录 商城复合案例功能实现&#xff08;二&#xff09;商城首页实现步骤1.准备工作2. 搭建html框架3. 编写js代码 完整实例代码完整项目心得 商城复合案例功能实现&#xff08;二&#xff09; 使用html&#xff0c;css&#xff0c;基于bootstrap框架以及媒体查询搭建响应式布局…...

编程日记 2026/2/17 11:20:36

使用 JDBC 插入数据并获取自动生成的主键（如 MySQL 的 AUTO_INCREMENT 或 Oracle 的序列） 的完整示例代码，包含详细注释

以下是使用 JDBC 插入数据并获取自动生成的主键&#xff08;如 MySQL 的 AUTO_INCREMENT 或 Oracle 的序列&#xff09; 的完整示例代码&#xff0c;包含详细注释&#xff1a; import java.sql.*;public class GeneratedKeysExample {// 数据库连接参数private static final St…...

编程日记 2026/2/18 20:38:37

图解AUTOSAR_CP_EEPROM_Abstraction

AUTOSAR EEPROM抽象模块详细说明 基于AUTOSAR标准的EEPROM抽象层技术解析 目录 1. 概述 1.1 核心功能1.2 模块地位2. 架构概览 2.1 架构层次2.2 模块交互3. 配置结构 3.1 主要配置容器3.2 关键配置参数4. 状态管理 4.1 基本状态4.2 状态转换5. 接口设计 5.1 主要接口分类5.2 接…...

编程日记 2026/3/1 5:56:30

汇川EASY系列之以太网通讯（MODBUS_TCP做从站）

汇川easy系列PLC做MODBUS_TCP从站，不需要任何操作，但是有一些需要知道的东西。具体如下： 1、汇川easy系列PLC做MODBUS_TCP从站，，ModbusTCP服务器默认开启，无需设置通信协议（即不需要配置），端口号为“502”。ModbusTCP从站最多支持31个ModbusTCP客户端（ModbusTCP主站…...

编程日记 2026/2/26 22:43:56

QT 图表（拆线图，栏状图，饼状图 ,动态图表）

效果 折线图 // 创建折线数据系列// 创建折线系列QLineSeries *series new QLineSeries;// series->append(0, 6);// series->append(2, 4);// series->append(3, 8);// 创建图表并添加系列QChart *chart new QChart;chart->addSeries(series);chart->setTit…...

编程日记 2026/2/28 9:54:11

基于vue框架的在线影院系统a079l（程序+源码+数据库+调试部署+开发环境）带论文文档1万字以上，文末可获取，系统界面在最后面。

系统程序文件列表 项目功能&#xff1a;用户,电影,电影类别,电影库 开题报告内容 基于Vue框架的在线影院系统开题报告 一、研究背景与意义 随着文化娱乐产业的蓬勃发展&#xff0c;电影院作为人们休闲消遣的重要场所&#xff0c;其管理效率和服务质量直接影响着顾客的观影体…...

编程日记 2026/2/16 11:37:13

vscode/cursor中python运行路径设置 模块导入问题

vscode/cursor中python运行路径设置 ## 文件路径设置 问题描述 pycharm的项目用cursor运行&#xff0c;出现目录找不到 后来利用 os.getcwd()&#xff0c;经过打印调试发现是IDE的本身配置问题 pycharm中&#xff0c;os.getcwd()默认打开当前脚本所在目录 vscode/cursor中…...

编程日记 2026/2/16 3:08:59

OpenCV图像拼接（1）概述

操作系统&#xff1a;ubuntu22.04 OpenCV版本&#xff1a;OpenCV4.9 IDE:Visual Studio Code 编程语言&#xff1a;C11 算法描述 此图说明了在Stitcher类中实现的拼接模块流程。使用该类&#xff0c;可以配置/移除某些步骤&#xff0c;即根据特定需求调整拼接流程。流程中的所…...

编程日记 2026/2/19 17:02:12

NFS 安装与测试

NFS 安装与测试 服务器 # NFS 共享目录 mkdir -p ${HOME}/Share/nfs && sudo chown -R nobody:nogroup ${HOME}/Share/nfs# 安装 NFS Server sudo apt install nfs-kernel-server# 配置 NFS 目录 sudo cp -arf /etc/exports /etc/exports.bak sudo tee -a /etc/exports…...

编程日记 2025/11/22 7:47:52

深度学习与传统算法在人脸识别领域的演进：从Eigenfaces到ArcFace

一、传统人脸识别方法的发展与局限 1.1 Eigenfaces&#xff1a;主成分分析的经典实践 算法原理 Eigenfaces是基于主成分分析&#xff08;PCA&#xff09;的里程碑式方法。其核心思想是将人脸图像视为高维向量&#xff0c;通过协方差矩阵计算特征向量&#xff08;即特征脸&…...

编程日记 2026/2/16 12:30:54

基于ssm学科竞赛小程序的设计及实现(源码+lw+部署文档+讲解)，源码可白嫖!

摘要 随着信息时代的来临&#xff0c;过去的学科竞赛管理方式的缺点逐渐暴露&#xff0c;本次对过去的学科竞赛管理方式的缺点进行分析&#xff0c;采取计算机方式构建学科竞赛小程序。本文通过阅读相关文献&#xff0c;研究国内外相关技术&#xff0c;提出了一种关于竞赛信息…...

编程日记 2026/2/15 7:53:35

【嵌入式学习】触发器 - ADC - DAC

# 触发器 基本概念&#xff1a;一种能够存储一位二进制信息的数字逻辑电路&#xff0c;其输出不仅取决于当前输入&#xff0c;还与之前的状态有关。 常见触发器类型&#xff1a; ①RS触发器&#xff1a;最基本的双稳态电路&#xff0c;包含两个输入&#xff08;置位S和复位R&…...

编程日记 2026/2/24 17:28:09

[特殊字符][特殊字符][特殊字符][特殊字符][特殊字符][特殊字符]壁紙 流光染墨，碎影入梦

#Cosplay #&#x1f9da;‍♀️Bangni邦尼&#x1f430;. #&#x1f4f7; 穹妹 Set.01 #后期圈小程序 琼枝低垂&#xff0c;霜花浸透夜色&#xff0c;风起时&#xff0c;微光轻拂檐角&#xff0c;洒落一地星辉。远山隐于烟岚&#xff0c;唯余一抹青黛&#xff0c;勾勒出天光水…...

编程日记 2026/2/19 19:21:39

虚拟机的三种 Linux 网络配置原理图解读

前言 虚拟机的网络连接方式主要有 三种模式&#xff1a;桥接模式&#xff08;Bridged&#xff09;、NAT 模式&#xff08;Network Address Translation&#xff09;、仅主机模式&#xff08;Host-Only&#xff09;。每种模式都有不同的使用场景和网络适应性&#xff0c;具体解释…...

编程日记 2026/2/14 3:35:56

AI Agent系列(七) -思维链(Chain of Thought,CoT)

AI Agent系列【七】 前言一、CoT技术详解1.1 CoT组成1.2 CoT的特点 二、CoT的作用三、CoT的好处四、CoT适用场景五、CoT的推理结构 前言 思维链(Chain of Thought,CoT)&#xff0c;思维链就是一系列中间的推理步骤(a series of intermediate reasoning steps)&#xff0c;通过…...

编程日记 2026/2/25 18:24:12

SpringBoot实现异步调用的方法

在Java中使用Spring Boot实现异步请求和异步调用是一个常见的需求&#xff0c;可以提高应用程序的性能和响应能力。以下是实现这两种异步操作的基本方法&#xff1a; 一、异步请求&#xff08;Asynchronous Request&#xff09; 异步请求允许客户端发送请求后立即返回&#x…...

编程日记 2026/2/23 16:14:14

PurpleLlama大模型安全全套检测方案

1. 引入 PurpleLlama是Meta的大模型安全整体解决方案&#xff08;参考1&#xff09;&#xff0c;它包括了 &#xff08;1&#xff09;安全评估 CyberSecEval是一个用于评估大型语言模型&#xff08;LLMs&#xff09;安全风险的基准套件&#xff0c;其目标是解决随着 LLMs 的广…...

编程日记 2026/2/15 17:02:18

vue el-table 设置selection选中状态

toggleRowSelection 方法 vue el-table 设置selection选中状态 关键代码 multipleTableRef.value!.toggleRowSelection(item, true);<el-table:data"data":border"setBorder"v-bind"$attrs"row-key"id"stripestyle"width: 1…...

编程日记 2026/2/15 14:59:33

STM32学习笔记之常用总线（原理篇）

&#x1f4e2;&#xff1a;如果你也对机器人、人工智能感兴趣&#xff0c;看来我们志同道合✨ &#x1f4e2;&#xff1a;不妨浏览一下我的博客主页【https://blog.csdn.net/weixin_51244852】 &#x1f4e2;&#xff1a;文章若有幸对你有帮助&#xff0c;可点赞 &#x1f44d;…...

编程日记 2026/2/14 11:02:06

【数据结构】栈(Stack)、队列(Queue)、双端队列(Deque) —— 有码有图有真相

目录 栈和队列 1. 栈&#xff08;Stack&#xff09; 1.1 概念 1.2 栈的使用&#xff08;原始方法&#xff09; 1.3 栈的模拟实现 【小结】 2. 栈的应用场景 1、改变元素的序列 2、将递归转化为循环 3、逆波兰表达式求值 4、括号匹配 5、出栈入栈次序匹配 6、最小栈…...

编程日记 2026/2/14 4:21:48

OpenCV中的矩阵操作

OpenCV中的矩阵操作主要围绕Mat类展开&#xff0c;涵盖创建、访问、运算及变换等。 1. 创建矩阵 ‌零矩阵/单位矩阵‌&#xff1a; Mat zeros Mat::zeros(3, 3, CV_32F); // 3x3浮点零矩阵 Mat eye Mat::eye(3, 3, CV_32F); // 3x3单位矩阵 自定义初始化‌&#xff1a…...

编程日记 2026/2/14 19:26:50

OAK相机入门（一）：深度测距原理

文章目录 1. 测距参数介绍2. 测距原理3. 总结 官方文档 Configuring Stereo Depth 1. 测距参数介绍 理论范围&#xff1a;0.2-35m 推荐范文&#xff1a;不低于0.5m 存储类型&#xff1a;uint16&#xff0c;0代表没有数据&#xff0c;或者测不到 2. 测距原理 通过视差进行测距…...

编程日记 2026/2/14 23:28:31