Angularjs 1.5 组件模式,带有回调函数,由 IE11 中的嵌入对象多次调用,不更新 Angular 绑定

2024-03-28

在 IE 11 中,我有一个 Angularjs 1.5 模态组件,如下所示。模式打开,在渲染事件中,它使用该组件中包含的回调函数调用角度应用程序外部的函数。这个外部函数启动一个安装过程,启动一个嵌入对象,如下所示,然后定期调用回调函数。

我遇到的问题是模板中从嵌入对象调用调用的每个回调函数上的绑定没有更新。 console.log 被执行,我可以在控制台中看到该消息。 绑定最初是用“启动过程”更新的,因此绑定是正确的

<span ng-bind="$ctrl.messages[$ctrl.messages.length - 1]"></span>

我尝试按如下方式调用scope.app,但没有任何反应。仅当启动进程完成时,绑定才会使用最终回调调用中显示的最后一条消息进行更新。因此,initiateprocess 函数会阻止绑定,但不会阻止 console.log 的

这是处理多个回调和更新绑定的正确方法吗

  angular.module('components')
  .component('testModal', {
    bindings:{
      modalInstance: '<',
      resolve: '=',
      dismiss: '&',
      close: '&'
    },
    controller: TestController,
    templateUrl: 'scripts/components/TestModal.html'
});

TestController.$inject = ['$scope'];
function TestController($scope) {
  var ctrl = this;

  ctrl.$onInit = function(){
    ctrl.messages = [];
    ctrl.messages.push('starting process');
  };

  ctrl.modalInstance.rendered.then(function(){
    CallVanillaJSFunction(callback); 
  });

  function callback(message){
    ctrl.messages.push(message);
    console.log(ctrl.messages[ctrl.messages.length - 1]);
    CheckScopeBeforeApply();
  }

  function CheckScopeBeforeApply() {
    if(!$scope.$$phase) {
      $scope.$apply();
      console.log('scope applied');
    }
  };

}

香草函数

var globalCallback;

function CallVanillaJSFunction(callback){
    globalCallback = callback;
    var complete = initiateprocess();
    globalCallback(complete);
}

嵌入对象

<OBJECT ID="testObj" CLASS......
<SCRIPT language=javascript for=testObj event="OnEvent(message);">
      if(navigator.userAgent.indexOf("Trident") != -1)
      {
         globalCallback(message);
      }
    </SCRIPT>

这个问题已被标记为重复,但查看了重复项后,我认为它不一样。全局回调函数可以被多次调用,而 Angular 应用程序不知道它会被调用多少次。


Use the $timeout强制浏览器勾选的服务:

  function callback(message){
    $timeout(function() {
       ctrl.messages.push(message);
       console.log(ctrl.messages[ctrl.messages.length - 1]);
    });
    ̶C̶h̶e̶c̶k̶S̶c̶o̶p̶e̶B̶e̶f̶o̶r̶e̶A̶p̶p̶l̶y̶(̶)̶;̶
  }

如果消息的更新全部发生在同一个浏览器刻度中,则仅呈现最后的更新。这$timeout服务执行框架摘要周期和浏览器渲染周期。

有关更多信息,请参阅AngularJS $timeout 服务 API 参考 https://docs.angularjs.org/api/ng/service/%24timeout

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Angularjs 1.5 组件模式,带有回调函数,由 IE11 中的嵌入对象多次调用,不更新 Angular 绑定 的相关文章

  • Angularjs $http 等待响应

    我是 javascript angularjs 的新手 我想在某些元素上完成鼠标悬停时显示引导弹出窗口 我为此创建了一个指令 function angular app app directive popOver window http fu
  • JNI - 如何从 C++ 或 C 回调到 Java?

    我有调用本机 C C 代码的 Java 应用程序 C C 代码需要回调到 Java 中 你能给我一些如何做到这一点的例子吗 有许多有效的方法可以从 C C 回调到 Java 我将向您展示一种使用 C 的技术 易于调整 C 的环境 该技术使得
  • 使用引用的 ItemsSource 绑定到 SelectedItem

    Intro 我有一个不同的数据源池 我有口罩 面具有索引线 每个 Indexline 都有一个来自关联池的数据源 Classes public class DataSource public string Name get set publ
  • 访问 BindingContext[dataSource] 与 BindingContext[dataSource, dataMember] 有何不同?

    我们遇到了一个problem https stackoverflow com q 24170402 302677 where 我们在 MDI 工作区中有同一窗口的两个实例 绑定到两个单独的对象模型 对象模型有它们的 Equals and G
  • 在 Karma+AngularJS 测试中加载模拟 JSON 文件

    我有一个 AngularJS 应用程序 使用 Karma Jasmine 设置了测试 我想测试一个函数 它接受一个大型 JSON 对象 将其转换为应用程序其余部分更容易使用的格式 然后返回转换后的对象 就是这样 对于我的测试 我希望您有单独
  • 在 AngularJS 中将数组绑定到指令变量

    我正在尝试将数组放入模板中 以便我可以使用其中的各个值 我的问题是 该属性一旦进入我的模板就会变成字符串 因此它不再可以作为 var 0 访问 而是返回 字符串 的第一个字符 通常是 这是数据的简化设置 varForward 100 1 v
  • 如何使用 ng-if 测试变量是否已定义

    有没有办法使用ng if测试变量是否已定义 而不仅仅是它是否为真 在下面的示例中 现场演示 http plnkr co edit jKPN0dOHDWBtPxJHXv2R p preview HTML 仅显示红色商品的运费 因为item s
  • 在模态中打开模态

    我有一个有角度的 ui 模态 其中有一个按钮 单击此按钮时 我想在 Angular ui 中打开另一个模式 我该怎么做 scope open function var modalInstance modal open templateUrl
  • 如何使用 $http.get 获取 304 状态代码?

    如何使用 http get 获取 304 状态代码 http get menu json success function data status headers scope menu data console log status sho
  • 在 AngularJs 中动态更改按钮文本

    我正在使用 AngularJS CSS 和 HTML 这就是我想做的 根据某个函数的输出禁用按钮isPublished 我需要将鼠标悬停在按钮上 就像禁用按钮时 将鼠标悬停在文本上可能是 I m disabled 当它没有被禁用时 悬停在文
  • cordova.js 导致引用错误“未定义需求”

    我想用恩科尔多瓦检测设备的网络状态 然而 一旦我包括科尔多瓦 js我收到一个错误 未捕获的引用错误 未定义 require cordova js 23 我已经安装并成功运行Node js and Cordova 我已经下载并安装了恩科尔多瓦
  • Angular JS 在调用新的 $http 之前取消 $http 调用

    在 Angular JS 1 1 5 中 您可以取消之前启动的 http 调用 这两个link1 https stackoverflow com questions 16962232 in angularjs how to stop ong
  • 选择器的内部文本

    我尝试从此标记中获取内部文本 span class ng binding ng scope Displaying results 1 25 of 17 430 span 使用此选择器 document querySelectorAll di
  • 根据用户区域设置过滤字符串列表

    当使用 AngularJS 1 6 处理 JavaScript 项目时 我有一个要过滤的字符串列表 例如 假设我的列表包含 rbol cig e a nido and tubo 当过滤西班牙语字符串时 如果我过滤 u 我会期望两者cig e
  • 从指令动态地将角度属性添加到元素

    我正在尝试构建一个指令来更改缓慢的 ajax 调用按钮上的加载状态 基本上 这个想法是为按钮元素设置一个属性 ng loading 并让指令添加其余的内容 这是html代码
  • 使用 INotifyPropertyChanged

    有人可以解释一下为什么在 wpf 中使用绑定时需要使用 INotifyPropertyChanged 的 实现吗 我可以在不实现此接口的情况下绑定属性吗 例如我有代码 public class StudentData INotifyProp
  • 在角度控制器中监听文档事件

    如何捕获角度控制器中的事件 我有文档级事件 所以我需要在角度控制器中捕获事件 这可能吗 Update 我有独立的 js 文件来处理来自相机的一些操作 document addEventListener myCameraEvent handl
  • 当请求新页面时,如何将 AngularJS 路由与 Express (Node.js) 结合使用?

    我正在使用 Express 它从静态目录加载 AngularJS 一般情况下我会要求http localhost 其中 Express 为我服务index html以及所有正确的 Angular 文件等 在我的 Angular 应用程序中
  • 如何正确清理来自 AngularJS 控制器的无效输入的表单?

    我有一个 AngularJS 表单 其中包含 除其他字段之外 类型之一url 后者很重要 因为这会强制相应的输入成为有效的 URL 在某些条件下 例如 要关闭具有此类表单的模式对话框 我想以编程方式清除该表单 为此 我实现了方法reset基
  • 在 Angular 中让多个调用等待同一个 Promise

    我在一个页面上有多个使用相同服务的控制器 为了举例 我们将服务称为 USER 第一次调用 USER getUser 时 它会发出 http 请求来获取有关用户的数据 调用完成后 它将数据存储在 USER data 中 如果再次调用 USER

随机推荐

  • WFFM 8.0 - 缺少保存到数据库操作

    我刚刚安装了 Web Forms For Marketers 8 0 并做了一个测试表单 尝试选择Save to Database从操作列表中但它不存在 另外 我已经检查过 sitecore system Modules Web Forms
  • 哪里有指示不应写入“程序文件”区域的指南?

    许多关于SO的问题都说 Windows开发人员指南 或 Windows设计指南 说你不应该将临时数据或程序数据写入程序文件区域 但据我所知 它们都没有真正链接到文档这就是说 搜索 MSDN 没有得到任何结果 Windows 将使该区域变为只
  • clojure(带超时...宏)

    我正在寻找一个宏 如果表达式完成时间超过 X 秒 它将引发异常 这个问题在这里有更好的答案 执行具有超时功能的函数 https stackoverflow com questions 6694530 executing a function
  • Visual Studio 将项目发布到一个简单的安装程序中

    我有一个相当大的项目 包含多个类 500 多个图像以及与该项目关联的 20 多个文本文件 我一直通过右键单击来发布我的项目project gt properties 然后单击 发布 选项卡 我已将文本文件和图像包含为resources已经
  • 如何使用 CSS 使 div 上的滚动条变粗?

    如果我使用 CSS 溢出属性 overflow scroll 默认情况下我得到一个细滚动条 我如何设计它以获得宽 且平坦 的滚动条 您可以在这里找到有关如何在多个浏览器上更改滚动条设计的答案 https stackoverflow com
  • Rails activesupport 通知 - 错误的数据库运行时值

    我正在尝试记录 REST API 应用程序的请求 我为此使用 Rails 通知 如下所示http railscasts com episodes 249 notifications in rails 3 http railscasts co
  • 更改 TortoiseGit 中的存储库 url

    我们刚刚将 git 存储库更新到了新位置 我正在使用 TortoiseGit 进行一些未提交的更改 我可以在任何地方更改文件夹引用吗 我在上下文菜单中没有看到该选项 如果可以避免的话 我宁愿不重新创建和合并 因为总共大约有 14 个存储库
  • 使用现有的 Rails 应用程序添加 twitter-bootstrap-rails

    我尝试将 twitter bootstrap rails 与现有的 Rails 应用程序一起使用 并在刷新页面时收到以下错误 没有要加载的文件 less 在 app assets stylesheets bootstrap and over
  • 如何将UIScrollView的触摸事件发送到其后面的视图?

    我在另一个视图之上有一个透明的 UIScrollView 滚动视图有内容 文本和图像 用于显示信息 它后面的视图有一些用户应该能够点击的图像 并且它们上面的内容可以使用提到的滚动视图进行滚动 我希望能够正常使用滚动视图 尽管没有缩放 但是当
  • 节点检查器无法连接到节点

    我运行节点 node debug app OR node debug brk app 它回应 debugger listening on port 5858 Express server listening on port 1338 我现在
  • 将 varchar 值转换为 int,如果输入错误,不会引发异常

    有没有办法调用 Sql Server 函数 Convert Cast 而不让它们抛出异常 基本上 我有一列包含字母数字数据 我正在从字段中提取值 并且我想将数据显示为整数值 有时提取的数据不是数字 在这些情况下我希望 Sql Server
  • 为什么我嵌入的 JointJS 元素重叠?

    我正在研究 JointJS 图 使用 DirectedGraph 来处理布局 我试图实现类似于下图的效果 我需要将节点 A B C D E F G H I J 概述 或包含在单独的节点 Foo Bar Hmm 中 当我将所有元素添加到图表中
  • Android 插件将使用哪个 cmake?

    在 Android Studio 3 3 中 我使用本机 C 库 它是用 CMake 构建的 Android 插件 v 3 2 1 将根据配置选择 内置 或 外部 cmakeexternalNativeBuild 如记录于开发者 andro
  • 证书被苹果拒绝

    While configuring certificate for Push Notification on my ios build of cordova project using OneSignal the certificate i
  • 带百分比的虚线圆条

    我正在尝试制作一个带有虚线的圆形进度条 我以编程方式创建stroke dasharray and stroke dashoffset用百分比画一个圆 我需要绘制虚线圆 而不是实心圆 如下所示 我无法将实心圆更改为虚线圆 我是否遗漏了一些东西
  • 使用 C# 中的字典计算字符串中每个重复单词的出现次数[关闭]

    Closed 这个问题需要细节或清晰度 help closed questions 目前不接受答案 编辑 我详细阐述了我的问题更多 解决方案在这里用于修复重复的单词 有人问我每个重复的单词 我是新手 可能不是一个好问题 这是字符串 stri
  • 在屏幕中央显示 Windows 窗体(双屏)

    我有双显示器 想要在屏幕中央显示一个窗口窗体 我有一个变量 MonitorId 0 或 1 I have System Windows Forms Screen allScreens System Windows Forms Screen
  • 解决错误 MSB8011:无法注册输出

    一个奇怪的错误 错误 MSB8011 无法注册输出 请尝试启用每用户 从命令提示符重定向或注册组件 提升的权限 C 程序 文件 MSBuild Microsoft Cpp v4 0 Microsoft CppCommon targets 7
  • Flutter:CupertinoTabBar 在移动到下一个屏幕时不会消失

    我正在运行 Google 的 Flutter Gallery 示例 https github com flutter flutter blob master examples flutter gallery lib demo cuperti
  • Angularjs 1.5 组件模式,带有回调函数,由 IE11 中的嵌入对象多次调用,不更新 Angular 绑定

    在 IE 11 中 我有一个 Angularjs 1 5 模态组件 如下所示 模式打开 在渲染事件中 它使用该组件中包含的回调函数调用角度应用程序外部的函数 这个外部函数启动一个安装过程 启动一个嵌入对象 如下所示 然后定期调用回调函数 我