控制台获取AngularJS某个元素的Scope

最新推荐文章于 2021-06-18 23:42:29 发布

weixin_34388207

最新推荐文章于 2021-06-18 23:42:29 发布

阅读量815

点赞数

文章标签： javascript ViewUI

本文介绍如何在浏览器控制台中获取Angular应用中特定元素的Scope。通过选择页面上的input元素，使用$0引用该元素，并通过angular.element($0).scope()命令获取其Scope对象。此方法有助于理解Angular作用域并进行调试。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

如何在控制台获取到某个元素的Scope呢？

假设，页面元素为：

<label>Name:</label>
<input type="text" ng-model="yourName" placeholder="Enter a name here">
<h1>{{yourName}}</h1>

→ 选择input元素

→ 在控制台输入"$0"，显示如下：

<input type="text" ng-model="yourName" placeholder="Enter a name here" class="ng-valid ng-dirty">

→ 在控制台输入"angular.element($0).scope()"

Scope {$id: "006", $$childTail:null, $$childHead: null, $$prevSibling: null, $$nextSibling:null...}

→ 给Scope的变量赋值

var $scope = angular.element($0).scope();
$scope.yourName = "";
$scope.apply();