登录
当前位置： 首页 > 面试题库 >

表达式评估了2次

戚宏扬
2023-03-14
问题内容：

在以下示例中：

test.html

<!DOCTYPE html>
<html ng-app ng-controller="AppController">
    <head>
        <script type="text/javascript"  src="angular.js"></script>
        <script type="text/javascript"  src="script1.js"></script>
    </head>
    <body>
        <div ng-include="'test1.html'"></div>
        {{testFn()}}
    </body>
</html>

test1.html

<div>{{testFn()}}</div>

script1.js

function AppController($scope) {
    $scope.testFn = function() {
        console.log("TestFn");
        return "test";
    }
}

发生fn testFn执行4次。我希望在控制台中只能看到2条日志。即使，即使我删除

<div ng-include="'test1.html'"></div>

有2个日志，而不仅仅是一个。我怎么了

更新：

angular.js

// added console.log to original code
var ngBindDirective = ngDirective(function(scope, element, attr) {
  console.log("ngDirective", attr.ngBind);
  element.addClass('ng-binding').data('$binding', attr.ngBind);
  scope.$watch(attr.ngBind, function ngBindWatchAction(value) {
    console.log("ngDirective - scope.$watch", value);
    element.text(value == undefined ? '' : value);
  });
});

test.html

<!DOCTYPE html>
<html ng-app ng-controller="AppController">
    <head>
        <script type="text/javascript"  src="angular.js"></script>
        <script type="text/javascript"  src="script1.js"></script>
    </head>
    <body>
        <div ng-bind="testFn()"></span>

    </body>
</html>

安慰

createInjector - modulesToLoad undefined angular.js:2666
loadModules undefined angular.js:2756
createInjector - modulesToLoad 
["ng", Array[2]]
 angular.js:2666
loadModules 
["ng", Array[2]]
 angular.js:2756
loadModules ["ngLocale"] angular.js:2756
loadModules [] angular.js:2756
supportObject - key $locale angular.js:2702
provider - name $locale angular.js:2712
supportObject - key $compile angular.js:2702
provider - name $compile angular.js:2712
supportObject - key aDirective angular.js:2702
factory - name aDirective angular.js:2723
provider - name aDirective angular.js:2712
supportObject - key inputDirective angular.js:2702
factory - name inputDirective angular.js:2723
provider - name inputDirective angular.js:2712
supportObject - key textareaDirective angular.js:2702
factory - name textareaDirective angular.js:2723
provider - name textareaDirective angular.js:2712
supportObject - key formDirective angular.js:2702
factory - name formDirective angular.js:2723
provider - name formDirective angular.js:2712
supportObject - key scriptDirective angular.js:2702
factory - name scriptDirective angular.js:2723
provider - name scriptDirective angular.js:2712
supportObject - key selectDirective angular.js:2702
factory - name selectDirective angular.js:2723
provider - name selectDirective angular.js:2712
supportObject - key styleDirective angular.js:2702
factory - name styleDirective angular.js:2723
provider - name styleDirective angular.js:2712
supportObject - key optionDirective angular.js:2702
factory - name optionDirective angular.js:2723
provider - name optionDirective angular.js:2712
supportObject - key ngBindDirective angular.js:2702
factory - name ngBindDirective angular.js:2723
provider - name ngBindDirective angular.js:2712
supportObject - key ngBindHtmlUnsafeDirective angular.js:2702
factory - name ngBindHtmlUnsafeDirective angular.js:2723
provider - name ngBindHtmlUnsafeDirective angular.js:2712
supportObject - key ngBindTemplateDirective angular.js:2702
factory - name ngBindTemplateDirective angular.js:2723
provider - name ngBindTemplateDirective angular.js:2712
supportObject - key ngClassDirective angular.js:2702
factory - name ngClassDirective angular.js:2723
provider - name ngClassDirective angular.js:2712
supportObject - key ngClassEvenDirective angular.js:2702
factory - name ngClassEvenDirective angular.js:2723
provider - name ngClassEvenDirective angular.js:2712
supportObject - key ngClassOddDirective angular.js:2702
factory - name ngClassOddDirective angular.js:2723
provider - name ngClassOddDirective angular.js:2712
supportObject - key ngCspDirective angular.js:2702
factory - name ngCspDirective angular.js:2723
provider - name ngCspDirective angular.js:2712
supportObject - key ngCloakDirective angular.js:2702
factory - name ngCloakDirective angular.js:2723
provider - name ngCloakDirective angular.js:2712
supportObject - key ngControllerDirective angular.js:2702
factory - name ngControllerDirective angular.js:2723
provider - name ngControllerDirective angular.js:2712
supportObject - key ngFormDirective angular.js:2702
factory - name ngFormDirective angular.js:2723
provider - name ngFormDirective angular.js:2712
supportObject - key ngHideDirective angular.js:2702
factory - name ngHideDirective angular.js:2723
provider - name ngHideDirective angular.js:2712
supportObject - key ngIncludeDirective angular.js:2702
factory - name ngIncludeDirective angular.js:2723
provider - name ngIncludeDirective angular.js:2712
supportObject - key ngInitDirective angular.js:2702
factory - name ngInitDirective angular.js:2723
provider - name ngInitDirective angular.js:2712
supportObject - key ngNonBindableDirective angular.js:2702
factory - name ngNonBindableDirective angular.js:2723
provider - name ngNonBindableDirective angular.js:2712
supportObject - key ngPluralizeDirective angular.js:2702
factory - name ngPluralizeDirective angular.js:2723
provider - name ngPluralizeDirective angular.js:2712
supportObject - key ngRepeatDirective angular.js:2702
factory - name ngRepeatDirective angular.js:2723
provider - name ngRepeatDirective angular.js:2712
supportObject - key ngShowDirective angular.js:2702
factory - name ngShowDirective angular.js:2723
provider - name ngShowDirective angular.js:2712
supportObject - key ngSubmitDirective angular.js:2702
factory - name ngSubmitDirective angular.js:2723
provider - name ngSubmitDirective angular.js:2712
supportObject - key ngStyleDirective angular.js:2702
factory - name ngStyleDirective angular.js:2723
provider - name ngStyleDirective angular.js:2712
supportObject - key ngSwitchDirective angular.js:2702
factory - name ngSwitchDirective angular.js:2723
provider - name ngSwitchDirective angular.js:2712
supportObject - key ngSwitchWhenDirective angular.js:2702
factory - name ngSwitchWhenDirective angular.js:2723
provider - name ngSwitchWhenDirective angular.js:2712
supportObject - key ngSwitchDefaultDirective angular.js:2702
factory - name ngSwitchDefaultDirective angular.js:2723
provider - name ngSwitchDefaultDirective angular.js:2712
supportObject - key ngOptionsDirective angular.js:2702
factory - name ngOptionsDirective angular.js:2723
provider - name ngOptionsDirective angular.js:2712
supportObject - key ngViewDirective angular.js:2702
factory - name ngViewDirective angular.js:2723
provider - name ngViewDirective angular.js:2712
supportObject - key ngTranscludeDirective angular.js:2702
factory - name ngTranscludeDirective angular.js:2723
provider - name ngTranscludeDirective angular.js:2712
supportObject - key ngModelDirective angular.js:2702
factory - name ngModelDirective angular.js:2723
provider - name ngModelDirective angular.js:2712
supportObject - key ngListDirective angular.js:2702
factory - name ngListDirective angular.js:2723
provider - name ngListDirective angular.js:2712
supportObject - key ngChangeDirective angular.js:2702
factory - name ngChangeDirective angular.js:2723
provider - name ngChangeDirective angular.js:2712
supportObject - key requiredDirective angular.js:2702
factory - name requiredDirective angular.js:2723
provider - name requiredDirective angular.js:2712
supportObject - key ngRequiredDirective angular.js:2702
factory - name ngRequiredDirective angular.js:2723
provider - name ngRequiredDirective angular.js:2712
supportObject - key ngValueDirective angular.js:2702
factory - name ngValueDirective angular.js:2723
provider - name ngValueDirective angular.js:2712
supportObject - key ngMultipleDirective angular.js:2702
factory - name ngMultipleDirective angular.js:2723
provider - name ngMultipleDirective angular.js:2712
supportObject - key ngSelectedDirective angular.js:2702
factory - name ngSelectedDirective angular.js:2723
provider - name ngSelectedDirective angular.js:2712
supportObject - key ngCheckedDirective angular.js:2702
factory - name ngCheckedDirective angular.js:2723
provider - name ngCheckedDirective angular.js:2712
supportObject - key ngDisabledDirective angular.js:2702
factory - name ngDisabledDirective angular.js:2723
provider - name ngDisabledDirective angular.js:2712
supportObject - key ngReadonlyDirective angular.js:2702
factory - name ngReadonlyDirective angular.js:2723
provider - name ngReadonlyDirective angular.js:2712
supportObject - key ngSrcDirective angular.js:2702
factory - name ngSrcDirective angular.js:2723
provider - name ngSrcDirective angular.js:2712
supportObject - key ngHrefDirective angular.js:2702
factory - name ngHrefDirective angular.js:2723
provider - name ngHrefDirective angular.js:2712
supportObject - key ngClickDirective angular.js:2702
factory - name ngClickDirective angular.js:2723
provider - name ngClickDirective angular.js:2712
supportObject - key ngDblclickDirective angular.js:2702
factory - name ngDblclickDirective angular.js:2723
provider - name ngDblclickDirective angular.js:2712
supportObject - key ngMousedownDirective angular.js:2702
factory - name ngMousedownDirective angular.js:2723
provider - name ngMousedownDirective angular.js:2712
supportObject - key ngMouseupDirective angular.js:2702
factory - name ngMouseupDirective angular.js:2723
provider - name ngMouseupDirective angular.js:2712
supportObject - key ngMouseoverDirective angular.js:2702
factory - name ngMouseoverDirective angular.js:2723
provider - name ngMouseoverDirective angular.js:2712
supportObject - key ngMouseoutDirective angular.js:2702
factory - name ngMouseoutDirective angular.js:2723
provider - name ngMouseoutDirective angular.js:2712
supportObject - key ngMousemoveDirective angular.js:2702
factory - name ngMousemoveDirective angular.js:2723
provider - name ngMousemoveDirective angular.js:2712
supportObject - key ngMouseenterDirective angular.js:2702
factory - name ngMouseenterDirective angular.js:2723
provider - name ngMouseenterDirective angular.js:2712
supportObject - key ngMouseleaveDirective angular.js:2702
factory - name ngMouseleaveDirective angular.js:2723
provider - name ngMouseleaveDirective angular.js:2712
supportObject - key 
Object {$anchorScroll: function, $browser: function, $cacheFactory: function, $controller: function, $document: function…}
 angular.js:2702
provider - name $anchorScroll angular.js:2712
provider - name $browser angular.js:2712
provider - name $cacheFactory angular.js:2712
provider - name $controller angular.js:2712
provider - name $document angular.js:2712
provider - name $exceptionHandler angular.js:2712
provider - name $filter angular.js:2712
supportObject - key currencyFilter angular.js:2702
factory - name currencyFilter angular.js:2723
provider - name currencyFilter angular.js:2712
supportObject - key dateFilter angular.js:2702
factory - name dateFilter angular.js:2723
provider - name dateFilter angular.js:2712
supportObject - key filterFilter angular.js:2702
factory - name filterFilter angular.js:2723
provider - name filterFilter angular.js:2712
supportObject - key jsonFilter angular.js:2702
factory - name jsonFilter angular.js:2723
provider - name jsonFilter angular.js:2712
supportObject - key limitToFilter angular.js:2702
factory - name limitToFilter angular.js:2723
provider - name limitToFilter angular.js:2712
supportObject - key lowercaseFilter angular.js:2702
factory - name lowercaseFilter angular.js:2723
provider - name lowercaseFilter angular.js:2712
supportObject - key numberFilter angular.js:2702
factory - name numberFilter angular.js:2723
provider - name numberFilter angular.js:2712
supportObject - key orderByFilter angular.js:2702
factory - name orderByFilter angular.js:2723
provider - name orderByFilter angular.js:2712
supportObject - key uppercaseFilter angular.js:2702
factory - name uppercaseFilter angular.js:2723
provider - name uppercaseFilter angular.js:2712
provider - name $interpolate angular.js:2712
provider - name $http angular.js:2712
provider - name $httpBackend angular.js:2712
provider - name $location angular.js:2712
provider - name $log angular.js:2712
provider - name $parse angular.js:2712
provider - name $route angular.js:2712
provider - name $routeParams angular.js:2712
provider - name $rootScope angular.js:2712
provider - name $q angular.js:2712
provider - name $sniffer angular.js:2712
provider - name $templateCache angular.js:2712
provider - name $timeout angular.js:2712
provider - name $window angular.js:2712
decorator - serviceName $rootScope angular.js:2742
supportObject - key $rootElement angular.js:2702
factory - name $rootElement angular.js:2723
provider - name $rootElement angular.js:2712
---------------------------------------------
ngDirective testFn() angular.js:12363
TestFn script1.js:3
ngDirective - scope.$watch test angular.js:12366
TestFn script1.js:3

问题答案：

更新：

在对视图表达式进行插值并运行摘要循环时，Angular会至少对每个表达式重新运行/插值至少两次，以便在渲染之前对其进行“规范化”（请参阅​​此github问题和本SO文章

因此，这是预期的行为。

因此，如果在视图表达式中使用范围方法，则这些方法应该是幂等的（给定相同的输入，它们应提供相同的输出）。



 类似资料：
  • 数学表达式评估

    问题内容： 什么是实现将采用字符串并根据运算符优先级输出结果的python程序的最佳方法（例如：“ 4 + 3 * 5”将输出19）。我在谷歌上寻找解决这个问题的方法，但是它们都太复杂了，我正在寻找一个（相对）简单的方法。 澄清：我需要比eval（）稍微先进的东西-我希望能够添加其他运算符（例如，最大运算符-4 $ 2 = 4），或者，我对此在学术上比对专业更感兴趣-我想知道 该怎么 做。 问题答

  • 评估后缀表达式

    本文向大家介绍评估后缀表达式，包括了评估后缀表达式的使用技巧和注意事项，需要的朋友参考一下 为了求解数学表达式，我们需要前缀或后缀形式。将中缀转换为后缀后，我们需要后缀评估算法来找到正确的答案。 在这里，我们还必须使用堆栈数据结构来解决后缀表达式。 从后缀表达式中，找到一些操作数后，将它们压入堆栈。找到某个运算符后，将从堆栈中弹出两个项目，并按正确的顺序执行操作。之后，结果也被压入堆栈中以备将来使

  • JSP：不评估EL表达式

    问题内容： 我有一个在Tomcat 5.5上运行的JSP页面。我有以下代码： 我得到的输出是： 我无法弄清楚为什么forEach循环有效，但输出无效。任何人可能提供的任何帮助都将是巨大的。 问题答案： 我知道默认情况下应该启用它，但是我一次又一次地跨页面（甚至是更改行为的同一页面）运行EL处理不会发生的页面。将以下内容添加到任何此类页面的顶部应可解决此问题： 我将它添加到每个页面中，因为它不会造成

  • Python用eval评估表达式

    本文向大家介绍Python用eval评估表达式，包括了Python用eval评估表达式的使用技巧和注意事项，需要的朋友参考一下 示例            

  • SQLServer CASE表达式-短路评估？

    问题内容： 我正在尝试优化执行以下操作的查询： 该查询计划表明，即使在100％的行满足WHEN子句的情况下，也有相当多的时间花费在ELSE分支中对结果的调用上。 我能理解的唯一方法是假定SQLServer正在评估两个结果，然后仅基于对WHEN条件的评估来选择一个，但是我找不到关于CASE结果是否有任何确定的参考语句在条件语句之前进行评估。任何人都可以澄清或指向我参考吗？ 问题答案： 那是实际的还是

  • 评估Java中的SQL表达式？

    问题内容： 在我们的项目中，我们需要在没有任何数据库服务器的情况下评估SQL语句。您能否建议一个免费的Java库，该库能够评估基于数学的SQL语句并返回结果？ 例如; 输入 输出 可能会被称为 问题答案： 如下面的代码所示，可以使用ZQL来实现。但是我严重建议您选择一个简单的嵌入式数据库，例如H2（此处为示例），而应使用它（项目运行状况要高得多）。 使用H2： 输出： 要使用它，请将其添加到您的：

相关阅读

SQLServer CASE表达式-短路评估？评估Java中的SQL表达式？评估布尔字符串表达式？在Python中评估布尔表达式Java中的布尔表达式评估

相关文章

XPath表达式腾讯云 录用评估挂JasperReports 报表表达式XQuery FLWOR表达式Erlang多表达式

相关问答

在Pandas中动态评估公式中的表达式Intellij IDEA评估表达式窗口和线程。currentThread（）。isInterrupted（）值Thymeleaf：使用#ses-异常评估SpringEL表达式的偶尔错误NPOI不评估3D公式在iReport中使用多个数据库评估表达式时出错

相关工具

Quartz 表达式生成器正则表达式测试器WizTools.org正则表达式测试工具iOS 评分控件卡片式插入列表

相关文档

正则表达式正则表达式（regular expression）Java 正则表达式教程Python 正则表达式操作指南java.util.regex 正则表达式 中文教程
快捷导航： 新手教程 算法原理 架构设计 Java进阶 数据库进阶 大厂专栏 面试经验 编程笔记 编程问答 所有专题 文档资料 工具软件 电子书籍 小牛导航
在线工具： 房贷计算器 个税计算器 Linux命令查询 Json格式化 正则表达式 颜色转换 AES加解密 SHA1加密 MD5加密 毒鸡汤 字数统计 随机密码生成 进制转换 Base64编解码 励志句子
Copyright © 2019-2024 小牛知识库@xnip.cn. All Rights Reserved.