位置: 编程技术 - 正文

使用Chrome浏览器调试AngularJS应用的方法(使用chrome浏览器打开)

编辑:rootadmin

推荐整理分享使用Chrome浏览器调试AngularJS应用的方法(使用chrome浏览器打开),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:如何使用Chrome浏览器,使用chrome浏览器观看,使用chrome浏览器提示需要chrome,使用chrome浏览器打不开网页,如何使用Chrome浏览器,使用chrome浏览器观看,使用chrome浏览器打不开网页,如何使用Chrome浏览器,内容如对您有帮助,希望把文章链接给更多的朋友!

当我们构建AngularJS应用时,通过浏览器(如Chrome,Firefox和IE)的JavaScript控制台访问应用中隐藏的数据和服务总会有些困难。下面是一些简单的技巧可以帮助我们通过Javascript控制台来查看或者控制正在运行的Angular应用,使得应用可以比较容易进行测试,修改,甚至实时的修改我们的Angular应用:1: 访问作用域

通过一行简单的JS程序访问页面中任何作用域(甚至是隔离的作用域!):

对于隔离作用域:

这里用`targetNode`作为HTML节点的引用。你可以非常轻松的通过`document.querySelector()`来创建一个`targetNode`

2:查看作用域树

有些时候,我们需要查看页面中作用域层次来有效的调试我们的应用。AngularJS Batarang正是我们需要的一款Chrome浏览器的扩展,可以展示当前作用域层次,并具有其他非常有用的特性。

3: 抓取任何服务

使用Chrome浏览器调试AngularJS应用的方法(使用chrome浏览器打开)

无论ngApp在哪里定义,我们都可以使用注入器功能来抓取任何的服务的引用(如果使用angular的bootstrap方法,则可以手动抓取$rootElement):

然后我们就可以对该服务进行调用,就像我们可以将服务注入一样。

4: 访问控制器使用指令

一些指令定义了一个拥有某些额外(通常是分享)功能的控制器。为了从控制台访问一个给定指令的控制器实例,只需使用 controller() 方法:

最后一种做法更高级并且不常用。5: Chrome 控制台特性

Chrome浏览器的控制台有一堆不错的捷径 来调试浏览器应用。这是一些Angular开发中最好的做法:

$0-$4: 访问最近在查看窗口中进行选取的 5 个DOM元素。选择抓取的范围非常方便。 $(selector)和$$(selector): 分别是querySelector() 和 querySelectorAll的一个快速的替代

感谢 @zgohr 提供这种方法!

结论

通过几个简单的技巧,我们可以访问页面任何作用域中的数据,查看作用域层次结构,注入服务和控制指令。

所以下一次,如果你想稍微进行调整,检查自己的工作或者通过控制台控制AngularJS一个用,我希望你能记住这些命令,并且能做到像我一样觉得他们非常实用!

使用AngularJS创建自定义的过滤器的方法 Angularjs过滤器是angularjs非常棒的特性之一。有朝一日,你可能需要使用自定义过滤器,幸运的是,你找到了这篇博文。下面显示的是自定义过滤器长什

使用AngularJS编写较为优美的JavaScript代码指南 本文示例代码下载:modulePattern.zip-所有的4个HTML文件以及panacea.js-1.6KB介绍AngularJS的库里面有很多东西,但本文中我只想专注于小的,针对特定主题的库

详细解读AngularJS中的表单验证编程 需求Name必填Username非必填,最小长度3,最大长度8Email非必填,但必须是合法的email验证未通过的表单不能提交显示一个必填或者非法email格式的错误信息

标签: 使用chrome浏览器打开

本文链接地址:https://www.jiuchutong.com/biancheng/380434.html 转载请保留说明!

上一篇:深入讲解AngularJS中的自定义指令的使用(深入讲解MACD:MACD红绿柱)

下一篇:使用AngularJS创建自定义的过滤器的方法(angular创建service)

  • 2021成品油增值税计算
  • 工商年报最迟什么时候申报
  • 固定资产在现金流量表中的体现
  • 厂房推倒重建房产税
  • 跨境电商怎么交税
  • 对外来发票金额怎么算
  • 小规模纳税人转成一般纳税人条件
  • 旅行社开具的发票是不都得写旅游服务
  • 一个十图
  • 进项票没开过来可以先开销项票吗
  • 季度弥补以前年度亏损报表怎么填
  • 一般企业车辆日期怎么算
  • 企业用给客户送礼吗
  • 进项税借方有余额要怎么处理
  • 制造企业享受增值税政策
  • 五月份和六月份都有什么节日
  • 全资子公司合并抵消
  • 通过拍卖取得的车牌号,过期了怎么办
  • 个税手续费返还政策文件
  • macbook自带的游戏
  • mac电脑command键快捷设置
  • 如何理解内容
  • 如何解决win7系统蓝牙接收模块影响电脑蓝屏
  • 未付款的增值税发票可以抵扣吗
  • 转出未交增值税怎么算
  • php调用图片
  • 进程mmc.exe
  • 固定资产一次性加速折旧
  • 菲律宾薄荷岛疫情最新消息
  • 超经营范围开具发票
  • 海关进口增值税如何入账
  • 存货的核算方法一次可以选用几个
  • python进行傅立叶变换
  • 房产契税滞纳金如何减免
  • phpcms 还有人用吗
  • 强化学习之stable_baseline3详细说明和各项功能的使用
  • 小微企业所得税优惠政策2023
  • db2 knowledge center
  • 计提工资的时候跟发放的时候不一样怎么办
  • 个人如何办理营业执照年检
  • 小规模纳税人企业所得税优惠政策最新2023
  • 跨年的房租费用怎么做账
  • 前期费用怎么计算
  • 原材料的对应账户有哪些
  • 变动成本法是指什么
  • 普通发票一般几个点
  • 什么样的纳税人属于小规模纳税人
  • 新会计准则印花税需要计提吗
  • 佣金和其他费用
  • 固定资产处置当月需要计提折旧吗
  • 固定资产内部转移流程
  • 多交的应交税费资产负债表怎么填
  • 同一控制下的控股合并中,投资方
  • 无票收入如何做凭证
  • 银行扣款后又退回怎么办
  • 餐饮赠券的会计分录
  • 财务会计制度的基本要求
  • 货拉拉平台收取费用
  • 出租车票单张限额
  • 公司转让无形资产开什么票
  • windows无法启动wlanautoconfig服务
  • windows 远程
  • ubuntu20.10
  • 怎么测试windows摄像头
  • wingate.exe - wingate是什么进程
  • 在局域网内,什么可进行网络资料的共享
  • win7无法正常关机
  • window八
  • lookAtCamera
  • text date excel
  • Androidannotation使用之@Rest与服务器交互的JSON数据转换(二)
  • Unity3d中GridLayoutGroup自适应高度
  • nodejs 模块
  • 怎么用python下载付费音乐
  • shell读取文本
  • javascript的dom
  • 国家医保平台查不到住院记录
  • 管道运输企业的核心指标是
  • 控件未安装或控件版本过低
  • 怎么查询公司法人电话号码
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设