angularjs - 使用 Batarang Chrome 扩展检查 AngularJS 范围-6ren

angularjs - 使用 Batarang Chrome 扩展检查 AngularJS 范围

转载作者：行者123 更新时间：2023-12-04 07:22:50

26

4

我有一个关于 AngularJs 范围的问题，尤其是使用 Batarang Chrome 扩展程序检查这些范围的方式。

我有以下 html :

<!doctype html>
<html lang="en" ng-app="myApp">
<head>
    <meta charset="utf-8">
    <title>My AngularJS App</title>
    <link rel="stylesheet" href="css/app.css"/>
</head>
<body>

<div ng-controller="myCtrl">

    <div enhanced-textarea ng-model="name"></div>
     <div cmp>
        <h3>{{name}}</h3>
        <div notice></div>
    </div>
</div>

<script src="lib/angular/angular.js"></script>
<script src="js/directives.js"></script>
<script src="js/controllers.js"></script>
<script src="js/app.js"></script>
</body>
</html>

这是指令 :

'use strict';

angular.module('myApp.directives', [])
    .directive('cmp', function () {
        return {
            restrict: 'A',
            controller: 'cmpCtrl',
            replace: true,
            transclude: true,
            scope: {
                name: '='
            },
            template: '<div ng-transclude></div>'
        };
    })
    .controller('cmpCtrl', ['$scope', '$element', '$attrs' , function ($scope, $element, $attrs) {
        $scope.$parent.$watch('name', function (newVal) {
            if (newVal) {
                $scope.$parent.updatedSize = newVal.length;
            }
        }, true);
    }])
    .directive('enhancedTextarea', function () {
        return {
            restrict: 'A',
            replace: true,
            transclude: true,
            template: '<textarea ng-transclude></textarea>'
        };
    })
    .directive('notice', function () {
        return {
            restrict: 'A',
            require: '^cmp',
            replace: true,
            scope: {
                updatedSize: '='
            },
            template: '<div>{{size}}</div>',
            link: function ($scope, $element, $attrs, cmpCtrl) {
                $scope.$parent.$watch('updatedSize', function (newVal) {
                    if (newVal) {
                        $scope.size = newVal;
                    }
                }, true);
            }
        };
    });

和 Controller :

'use strict';

angular.module('myApp.controllers', [])
  .controller('myCtrl', ['$scope', function($scope) {
        $scope.name = 'test';
  }]);

当我使用 batarang 检查范围时， 我得出以下结论 :

范围 002:ng-app

范围 003:ng- Controller (myCtrl)

范围 004: ？？？

范围 005:cmpCtrl(cmp 指令的 Controller )

范围 006:cmp 内部(h3 和通知)

范围007:通知指令的链接功能

以上正确吗？

还有，我最大的审讯是 004范围对应什么？

完整的应用程序位于 github here

另请参阅下面的屏幕截图:

screen capture

最佳答案

不是每个$scope必须对应于您的页面元素。事实上，在每个 AngularJS 应用程序中都有一堆 $scopes不直接链接到任何元素。

在您的情况下，它是 ng-transclude这会导致创建子作用域。

看一看 AngularJS 的实现，它会导致您创建 004 $scope .

if (!transcludedScope) {
    transcludedScope = scope.$new();
    transcludedScope.$$transcluded = true;
    scopeCreated = true;
}

https://github.com/angular/angular.js/blob/master/src/ng/compile.js#L959

如果您想深入挖掘自己，请在您的 AngularJS 文件中设置一个断点:

enter image description here

然后只需使用调用堆栈并跟随兔子......

关于angularjs - 使用 Batarang Chrome 扩展检查 AngularJS 范围，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/22283227/

26

4

0

文章推荐： expression-trees - Roslyn:表达式和 SytnaxTree

文章推荐： python - Numpy:在没有循环的情况下获取索引中的最小值？

文章推荐： Django zinnia 禁用评论或使用替代方案

javascript - 使用 jQuery 检查 radio 时，检查 radio 是否被选中不起作用
我需要根据需要动态设置文本区域，但它不想正常工作。 JQuery 会自行检查，但无法检查是否已检查。但是当您在第二个单选框内单击时，始终需要文本区域。我尝试了很多次让它工作，但它仍然有问题。我添加了“
python - Django : Fetch XML, 中的 urllib2/pycurl 检查 HTTP 状态，检查 HTTPS 连接
我需要在 Django 中进行 API 调用(某种形式)，作为我们所需的自定义身份验证系统的一部分。用户名和密码通过 SSL 发送到特定 URL(对这些参数使用 GET)，响应应该是 HTTP 200
检查#warning预处理器的可用性
我将在我的可移植 C 代码中使用 #warning 来生成编译时警告。但并非所有平台都支持 #warning。有什么方法可以找到该平台是否支持 #warning。 #ifdef warning
检查 for 语句中的条件
我编写了一个函数来检查某个数字是否存在于某个区间内。停止搜索的最佳方法是什么？这个: for (i = a; i <= b; i++) { fi = f(i); if (fi == c) {
检查 C 中的不同字符
我想知道在 c 中是否有一种方法可以检查，例如在 for 函数中，如果变量等于或不等于某些字符，而不必每次都重复进行相等性检查。如果我没记错的话，以这种方式检查相等性是不正确的: if (a == (
检查 C 中是否有可变参数
我有如下日志功能 void log_error(char * file_name, int line_num, int err_code) { printf("%s:%d:%s\n", fil
检查 SSH 私钥是否加密
使用 ssh-keygen 生成的 key 对在 macOS 上可以有不同的格式。 macOS 可读的标准 PEM ASN.1 对象 SecKey API 带有文本标题的 PEM OpenSSH ke
Excel:检查 IF 语句中的错误
我正在尝试编写一个 excel if 语句。我不熟悉使用 Excel 具有的所有额外功能。我正在使用一个名为 importXML() 的函数.我正在尝试检查我正在使用的函数是否生成“#VALUE!”错
检查 aio_write 是否完成
有没有办法检查是否没有 AIO 写入给定文件？我在我的 Unix 类(class)上制作了一个项目，该项目将是一个上下文无关(基于 UDP)的国际象棋服务器，并且所有数据都必须存储在文件中。应用程序将
java - 执行函数时避免连续的 "if (...)"检查
我有一个如下所示的函数: public Status execute() { Status status = doSomething(); if (status != Stat
php - 抑制特定文件夹或文件的错误消息/检查
我正在使用 Composer，我不希望 PhpStorm 在 vendor 文件夹上运行任何错误检查或检查，因为它对 vendor/中的某些代码显示误报composer/autoload_static
chapel - 检查/确保两个数组具有相同的域和分布的最佳方法是什么？
Chapel 的一个很好的特性是它区分了数组的域和它的分布。检查两个数组是否具有相同的域和分布(通常想要的)的最佳方法是什么？我能看到的最好的方法是检查 D1==D2和 D1.dist==D2.di
JavaScript:检查/比较所有字段的值
在我的 JavaScript 函数中，我为所有输入、文本区域和选择字段提供实际值作为 initial_value: $('input, textarea, select').each(function
PHP ErrorFlag 检查？
我正在编写一个分解为几个简单函数的 PHP 类。在构造函数中，它调用另一个名为 processFile 的函数。该函数调用 5 个私有(private)函数并进行检查。如果检查失败，它会将消息分配给
javascript - 检查 "how"链接被点击
这个问题已经有答案了: How to detect if user it trying to open a link in a new tab? (2 个回答) 已关闭 7 年前。我认为 JavaS
sql - 检查@@rowcount函数来确定行是否存在可以吗？
我正在浏览我们的代码库并看到很多这样的测试: declare @row_id int = ... declare @row_attribute string select @row_attribu
javascript - 检查 IF 语句内的函数解释
我正在声明一个用作比较的函数。我的问题是: 为什么条件充当语句？为什么第 4 行可以工作，而第 5 行却不行？我知道这段代码不切实际且未使用，但为什么编译器允许这种语法？谷歌没有找到答案。但话又
PHP - 检查/比较文本字段的输入
到目前为止，我有一个带有空文本字段的 PHP Kontaktform，并使用以下命令检查了所需的字段: $name = check_input($_POST['name'], "请输入姓名。"); 现
PHP 检查 not > 0
目前，我能想到的合理检查的唯一方法没有臃肿的逻辑: if ( $value > 0 ) { // Okay } else { // Not Okay } 有没有更好的办法？最佳答案
javascript - 检查[i]是否存在
我正在尝试运行一个脚本，如果 i 存在(意味着存在 i 值，任何值)或其他部分，我希望运行其中的一部分如果i没有值就运行，有人可以启发我吗？我说的是 for 循环，比如 for (var i=0;

首页

博学

6Ren·AI

商城

angularjs - 使用 Batarang Chrome 扩展检查 AngularJS 范围