位置: 编程技术 - 正文

使用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)

  • 计算应交增值税并结转未交增值税怎么做用友
  • 电费为什么计入成本费用
  • 银行入息是入几个月的
  • 定期定额纳税申报表是个人所得税吗
  • 收到的印花税退税怎么会计处理
  • 房地产企业收到预收款如何纳税
  • 应纳税额滞纳金
  • 高温补贴能以别的形式发放吗
  • 长期借款科目核算的是企业的长期借款本金和利息
  • 定期定额户超过定额怎么报个税
  • 收到费用发票入账后发现错误
  • 公司研发阶段的产品领料怎么处理?
  • 资本公积是啥
  • 商贸公司账务复杂吗
  • 企业发生的销售折让
  • 纳税人必知的十七项增值税开票指南
  • 销售方开具的红字信息表
  • 顶账的固定资产怎么入账
  • 生育津贴支付方式
  • 企业拆迁 补偿
  • 电脑输入法切换键怎么设置
  • win10怎么关闭开机磁盘自检
  • 科技研发公司经营范围包括哪些
  • PHP:Memcached::replaceByKey()的用法_Memcached类
  • php二分查找算法两种方法
  • 股本减少的账务怎么处理
  • 房地产预售收入如何缴纳所得税
  • 世界著名气泡酒公司
  • 伦索伊斯马拉赫塞斯国家公园
  • laravel实战教程
  • 阿里php面试题
  • php获取字符串位置
  • vue3中如何使用vuex
  • 国家给农民的青春有哪些
  • 固定资产出租收入属于
  • php判断数据类型
  • 个体工商户能享受4050政策吗
  • 分公司可以独立开票吗
  • 公司股东的权利和义务有哪些
  • 有销项没有进项怎么做分录
  • 代缴职工社保是啥意思
  • 自制小汽车
  • 购入房产会计记账凭证怎么做
  • 私车公用的风险防范
  • ukey要交服务费吗
  • 科技项目扶持资金
  • 开办费企业所得税处理
  • 当月只有进项票没有销项票怎么办
  • 企业给加盟店的钱怎么算
  • 用友作废的凭证怎么恢复
  • 注册工贸公司业务范围
  • 当月计提公积金下月发放怎么做分录
  • 企业无偿为员工买社保
  • 利润总额和未分成比例
  • 企业装卸费抵扣怎么做账
  • 单位员工购买本地保险
  • sql server m1
  • win8系统手机
  • win7右下角提示测试模式
  • OS X 10.12.6 beta 1如何更新 OS X 10.12.6 beta 1如何升级
  • linux计划任务执行脚本
  • javascript闭包优缺点
  • [置顶]游戏名 TentacleLocker
  • android中常用的adapter不包括
  • window.close(); 关闭浏览器窗口js代码的总结介绍
  • node.js和go
  • 编程python怎么学
  • 转义字符对应英文
  • hbuilderx打包app教程
  • jquery插件库怎么导入
  • android基础入门
  • ajax+node+request爬取网络图片的实例(宅男福利)
  • jquery拖拽流程布局
  • js中的array数组有什么缺点
  • 什么情况下税务局会罚款
  • 北京亦庄开发区属于哪个区
  • 苏州税务ukey客服电话
  • 吉林省工伤保险咨询电话
  • 深圳献血奖励标准
  • 黄金消费税如何征收
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

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

    友情链接: 武汉网站建设