在独立组件中调用方法时，Angular Dom不更新
是因为Angular的变更检测机制没有检测到变化。Angular使用了Zone.js来实现变更检测，它会监控所有的异步操作，包括事件处理、定时器、HTTP请求等。当这些异步操作完成后，Angular会自动检测并更新DOM。
然而，在独立组件中调用方法时，可能会出现变更检测机制无法检测到变化的情况。这通常是因为该方法是在Angular的变更检测范围之外被调用的，例如在setTimeout、setInterval等异步操作中调用的方法。
解决这个问题的方法是手动触发变更检测。可以使用Angular的ChangeDetectorRef服务来实现。ChangeDetectorRef提供了一些方法，如markForCheck和detectChanges，可以手动标记组件的变化并触发变更检测。
具体操作步骤如下：
- 在组件的构造函数中注入ChangeDetectorRef服务：constructor(private cdr: ChangeDetectorRef) {}
- 在需要手动触发变更检测的地方调用detectChanges方法：this.cdr.detectChanges();
这样，当调用方法时，Angular会重新检测组件的变化并更新DOM。
推荐的腾讯云相关产品：腾讯云云服务器（CVM） 产品介绍链接地址：https://cloud.tencent.com/product/cvm
相关·内容
我的配方组件中的一个方法使用食品杂货组件ref来调用食品杂货组件中的方法。配方组件方法称为groceryComponenent.addToGroceryList(recipeName，( addToGroceryList(recipeName，配料)该方法使用杂货组件引用来调用食材我曾经在我的杂货组件html中
浏览 9提问于2020-09-04得票数 1
回答已采纳
我试图用一个包含columns definition及其data array的结构化数据实现一个网格组件。import { Com
浏览 2提问于2018-02-24得票数 4
我正在学习Vue.js，并尝试了keep-alive和component机制，它们允许在组件之间动态切换。string): void { },});上面的代码将根据所单击的按钮显示SectionA或SectionB组件，同时还确保未显示的组件保持活动状态，保持其内部状态。在Angular中，我必须执行以下操作：
import { Component
浏览 7提问于2021-08-06得票数 1
我想在我的父组件中处理x3dom的shape html元素的单击事件。onclick 事件由x3dom触发。我只能用一个丑陋的黑客来委托它(见下文)。因为shape不是一个已知的shape标记，所以我必须定义一个shape组件？还是不？<shape (click)="doStuffInParent()" ></shape> <!-- click is not
浏览 4提问于2016-08-02得票数 0
每个用例都是一个由jsp/jQuery组成的“组件”构建的SPA。每个组件都是使用innerHTML + AJAX动态加载的。我们希望一次只重写一个组件，更好的方法是在最内层创建Angular组件，然后向外聚合它们，直到每个用例都是同质的Angular应用程序。有没有一种“干净”的方式在DOM的jQuery加载部分使用angular组件，例如，当遗留的jQuery
浏览 1提问于2017-10-26得票数 0
2回答
我有一个父组件和两个子组件(dataset-create和dataset-detail)在Angular2中。父组件通过在模板中使用以下代码来控制在任何给定时间显示两个组件中的哪一个：<template [ngSwitchWhen]="'create'">当它接收到它时，将调用
浏览 3提问于2016-01-28得票数 7
回答已采纳
在使用数据更新DOM之后，我需要执行一个方法。当我在设置属性(绑定到模板)后立即运行我的方法时，脚本确实在DOM中收到了空的div，因为Angular 2可能还没有更新它。奇怪的是，调用超时解决了这个问题，但感觉很糟糕。我如何确保我的方法在Angular 2更新模板后执行？我的组件：
impo
浏览 0提问于2017-03-26得票数 0
数据绑定在Angular 2中不起作用。调用方法时，名称不会更新。无法在从app.ts updateName()方法调用updateNameSibl()方法时更新secApp组件中的视图。添加更多细节--我有两个组件的两个视图的情况，从一个组件我想更新第二个组件的视图。更新按
浏览 0提问于2017-12-14得票数 0
3回答
在jQuery中，您可以创建可重用的UI组件。在AngularJS中，我知道使用指令是做这件事的等效方法。Directive语法包括一个Link属性，您可以在其中操作DOM。但这就是我感到困惑的地方。AngularJS旨在避免操作DOM，因为AngularJS在内部操作DOM，那么为什么要这样做呢？有没有一种更好的方法来做到这一点，而不必实际操作DOM？
浏览 3提问于2014-07-05得票数 1
1回答
我使用angular 8，在我的组件文件mycomponent.ts中有一个名为items的变量，它被绑定到我的HTML，如下所示。</div>另外，在该组件文件中，它有一个类似下面的函数。myComponent.msgFrmServer(update);变量得到更新，方法<
浏览 1提问于2021-01-08得票数 0
我使用的是BrowserAnimationsModule，并且在路由器上设置了一些动画，这样当用户导航时，当前组件就会滑出，新的/下一个组件就会滑入。这可以很好地工作。我使用AnimationEvent callback来执行操作，但我需要明确知道哪些动画组件(或仅仅是dom元素)当前正在进入或离开dom，也就是说，哪些组件与query(':enter')或query*如果你想知道我想要做什么-我想在:leave组
浏览 85提问于2021-11-20得票数 1
当要卸载React组件(即调用componentWillUnmount )时，是否保证所有后代都将正确卸载(因此也调用了componentWillUnmount )？换句话说，在卸载阶段，整个层次结构(沿着起始节点)将被移动，或者仅仅是要删除的确切节点？
浏览 2提问于2019-06-03得票数 2
回答已采纳
ReactJ有虚拟DOM来呈现更改。Angular2不包含虚拟DOM。Angular2和ReactJS一样是反应性的。对于angular2中的任何更改，整个组件不会被更改，但是组件的部分将被更改。Angular2用什么来显示组件部分的变化呢？编辑：，让我更具体一些。我知道检测变化是方法。但是变化检测发生在模型上。一旦更改检测、单向循环运行，就必须对真正的DOM进行
浏览 9提问于2016-10-18得票数 0
1回答
在带提前(AOT)编译的Angular 2中，我有一个父组件和一个子组件，如下所示： <h1>I am a parent</h1></div>
我知道子模板是动态插入到DOM中的。如果showChild的计算结果为false，Angula
浏览 1提问于2017-04-06得票数 32
回答已采纳
在创建角2中的动态组件时，我 表示该过程需要ViewContainerRef才能将新创建的组件添加到DOM中。在将@Input和@Output传递给那些动态创建的组件时，我在上面的第二个链接和中找到了答案。但是，如果我要创建一个名为shape.service的服务，该服务包含一些@Input (如bgColor )返回不同形状组件的函数，我不知道该服务如何在不指定DOM</
浏览 10提问于2016-08-31得票数 11
1回答
我在我的应用程序中使用Angular 2.1.1。考虑两个相互交互的组件。DeviceSettingsComponent是活动的，对用户是可见的。问题
当我更新到Angular 2.2.x时，在单击“关闭”按钮到从DOM中销毁/删除DeviceSettingsComponent之间有3-5秒的延迟。我可以看出，事件没有问题，单击“关闭”按钮时，将立即更新MainComponent<
浏览 3提问于2016-12-07得票数 2
$scope是如何在Angular2中实现的，例如: angular2是一个单独的对象，它会继续观察它的子元素，并触发更改angular2如何在没有$scope的情况下做到这一点
浏览 3提问于2017-09-02得票数 2
5回答
我想使导航从子组件，渲染在路由器-出口。我的父组件有一个路由器配置，我希望在某些事件上手动导航。但是，我不知道如何在没有输出的情况下从子数据传递到父数据(用于导航)。但我怎么能从孩子那里得到父母的方法。非常感谢您的帮助！
浏览 3提问于2016-06-06得票数 67
回答已采纳
Object.debugUpdateRenderer [as updateRenderer] (core.es5.js:13094)由以下给定方法生成的错误
浏览 38提问于2017-07-19得票数 0
回答已采纳
在angular 7中-使用卷影dom元素来处理隔离的作用域。在angular 7中创建组件背后的场景是什么，它的独立范围是如何工作的？
有没有人能帮我理解一下？
浏览 0提问于2019-04-02得票数 2
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
云直播
对象存储活动推荐
腾讯云开发者
