开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

Angular2 ngIf没有更新DOM吗？

Angular2的ngIf指令用于根据条件动态地添加或移除DOM元素。当条件为true时，ngIf会将元素添加到DOM中，当条件为false时，ngIf会从DOM中移除元素。

在Angular2中，ngIf指令会根据条件的变化来更新DOM。当条件发生变化时，ngIf会重新计算条件表达式，并根据结果来添加或移除DOM元素。这意味着ngIf会更新DOM以反映条件的变化。

ngIf的更新DOM的过程是通过Angular的变更检测机制实现的。Angular会在组件的变更检测周期中检测ngIf指令的条件是否发生变化，并根据条件的变化来更新DOM。这个过程是自动进行的，无需手动干预。

总结起来，Angular2的ngIf指令会根据条件的变化来更新DOM，确保DOM的状态与条件保持一致。

关于Angular2的ngIf指令的更多信息，您可以参考腾讯云的Angular文档：

https://cloud.tencent.com/document/product/1132/46382

相关搜索:*ngIf DOM更新定时问题(以Angular为单位阴影Dom没有显示子元素吗？道具没有更新吗？InnerHTML没有更新吗？render() -函数没有更新DOM - lit-html Angular2 dart DateTime没有键入保存吗？Python类别没有更新吗？ObservableField<String>没有更新吗？更新查询没有更新数据库吗？有没有办法在for循环中更新DOM元素？代码没有按顺序运行？对DOM的更新是一次完成的吗？回收器视图没有更新吗？seaborn库没有更新barplot吗？tensorflow GradientDescentOptimizer没有更新变量吗？有没有办法在Angular中等待DOM的更新？Angular2 AoT编译器没有ngfactory文件吗？回收者视图数据没有更新吗？UILabel在循环时没有更新吗？Gridview没有在updatepanel中更新吗？消费者没有更新状态吗？

相关搜索:

页面内容是否对你有帮助？

有帮助

没帮助

相关·内容

Angular2 VS Angular4 深度对比：特性、性能

在Web应用开发领域，Angular被认为是最好的开源JavaScript框架之一。

02

Angular2 @NgModule

@NgModule修饰的class。 @NgModule利用一个元数据对象来告诉Angular如何去编译和运行代码。一个模块内部可以包含组件、指令、管道，并且可以将它们的访问权限声明为公有，以使外部模块的组件可以访问和使用到它们。模块是用来组织应用的，通过模块机制外部类库可以很方便的扩展应用，Angular2将许多常用功能都分配到一个个的模块中，如:FormModule、HttpModule、RouterModule。

04

ionic3应该善用组件和指令

其实ionic3（angualr4）和ionic2（angular2）差不多，但和ionic1（angular1）就差别非常大了，可以说基本是推倒了重来。在angular1时代，组件和指令是一回事，即严格来说，没有组件这概念，只有指令，而到了angular2时代，虽说组件仍是一种特殊的指令，但已经有一定目的明显区分开来，分别用Directive和Component来标识，用cli生成命令就如下所示：

04

Angular 2 架构（下)

数据绑定为应用程序提供了一种简单而一致的方法来显示数据以及数据交互，它是管理应用程序里面数值的一种机制。

02

实战 | Change Detection And Batch Update

作者｜YanYang Yu 原文｜http://yuyang041060120.github.io/2016/09/22/change-detection-and-batch-update/ 前言在传统的WEB开发中，当与用户或服务器发生交互时，需要我们手动获取数据并更新DOM，这个过程是繁琐的、易错的。特别是当页面功能过于复杂时，我们既要关注数据的变化，又要维护DOM的更新，这样写出来的代码是很难维护的。新一代的框架或库，例如Angular、React、Vue等等让我们的关注点只在数据上，当数据更新

02

关于angular2路由激活状态时class设置

问题是这样的：上面的tabs各自对应一个路由，在后台这些tabs是由一个数组tabArray生成的，并不是写上去的，当用户点击左边的一个项目时，会push一个tab到tabArray中。以上的内容

03

干货 | 前端阶段性总结之「框架相关」那些事

其实本人接触框架里面，可能是Angular最多吧，之前项目都是Angular1，现在项目在用Angular2。

02

为什么现在的开发者总是拿 Vue.js 和 JavaScript 巨头 Angular、React 比较？

Vue.js 是一个用来构建 web UI 的 JavaScript 库，基于 MIT 开源协议。Vue.js 于 2013 年首次分布，但是在接下来的两年内，并没有太多的 web 框架领域的开发者关注。到了 2016 年，Vue.js 名声大噪，获得了极大的关注，以至于现在除了像 Angular 和 React 这样的重量级 JavaScript 库，又多了 Vue.js 这样的一个选择。

03

Change Detection And Batch Update

在传统的WEB开发中，当与用户或服务器发生交互时，需要我们手动获取数据并更新DOM，这个过程是繁琐的、易错的。特别是当页面功能过于复杂时，我们既要关注数据的变化，又要维护DOM的更新，这样写出来的代码是很难维护的。新一代的框架或库，例如Angular、React、Vue等等让我们的关注点只在数据上，当数据更新时，这些框架/库会帮我们更新DOM。那么这里就有两个很重要的问题了：当数据变化时，这些框架/库是如何感知到的？当我们连续更新数据时，这些框架/库如何避免连续更新DOM，而是进行批量更新？带着这两个问题，我将简要分析一下React、Angular1、Angular2及Vue的实现机制。

04

Change Detection And Batch Update

本文作者：IMWeb 吴浩麟原文出处：IMWeb社区未经同意，禁止转载前言在传统的WEB开发中，当与用户或服务器发生交互时，需要我们手动获取数据并更新DOM，这个过程是繁琐的、易错的

07

AngularJS2.0 教程系列（一）

AngularJS当初是提供给设计人员用来快速构建HTML表单的一个内部工具。随着时间的推移，各种特性被加入进去以适应不同场景下的应用开发。然而由于最初的架构限制（比如绑定和模板机制），性能的提升已经非常困难了。

01

【开发指南】（三）认识ionic3

如果你要做一个app应用，你有最少三种方式：原生开发、加壳在线WebApp开发与混合式开发。

04

Vuejs和其他前端框架的对比

React React 和 Vue 有许多相似之处，它们都有：使用 Virtual DOM 提供了响应式 (Reactive) 和组件化 (Composable) 的视图组件。将注意力集中保持在核心库，而将其他功能如路由和全局状态管理交给相关的库。由于有着众多的相似处，我们会用更多的时间在这一块进行比较。这里我们不只保证技术内容的准确性，同时也兼顾了平衡的考量。我们需要承认 React 比 Vue 更好的地方，比如更丰富的生态系统。相似之处 React与Vue存在很多相似之处，例如他们都是JavaS

vue.js与其他前端框架的对比

React React 和 Vue 有许多相似之处，它们都有：使用 Virtual DOM 提供了响应式 (Reactive) 和组件化 (Composable) 的视图组件。将注意力集中保持在核心库，而将其他功能如路由和全局状态管理交给相关的库。由于有着众多的相似处，我们会用更多的时间在这一块进行比较。这里我们不只保证技术内容的准确性，同时也兼顾了平衡的考量。我们需要承认 React 比 Vue 更好的地方，比如更丰富的生态系统。相似之处 React与Vue存在很多相似之处，例如他们都是JavaS

08

Angular2、Ionic、TypeScript、es6的关系？

其实对于这3个东西来说，我根本搞不清楚他们之间的关系，突然之间意识到，自己不能再这样搞不清楚关系的就学下去。这样就像angular1似的，自己还是什么都不会，angular1我会用，但是不会讲，你要问我angular1和ionic的关系，我现在也不能讲清楚，说明白。那么没关系，从小白做起，不会的就问，据说大神们都是乐于分享的。

03

Angular 2 + 折腾记：(2)初步认识angular2，不一样的开发模式

想来想去，概念这些东西不怎么想讲，更多的是想讲点实战性的内容。所以有些东西跳过去了，小伙伴们请去看官方文档哈；跳跃性的前进，写的不好多包涵。。。

02

npm依赖(框架平台)

写到最后总结得差不多了，后续如果我想起还有哪些框架平台遗漏的，会继续在这篇文章上补全，同时也希望各位倔友对文章里的要点进行补充或者提出自己的见解。欢迎在下方进行评论或补充喔，喜欢的点个赞或收个藏，保证你在开发时用得上。

02

Angular的12个经典问题，看看你能答对几个？（文末附带Angular测试）

Angular作为目前最为流行的前端框架，受到了前端开发者的普遍欢迎。不论是初学Angular的新手，还是有一定Angular开发经验的开发者，了解本文中的12个经典面试问题，都将会是一个深入了解和学习Angular 2的知识概念的绝佳途径。在文中，我们将会接触到很多Angular 2的重要概念，并附扩展阅读资料和自查小测试，供大家评估自己对Angular的了解程度。 Angular 经典问题及扩展阅读 1. 请解释Angular 2应用程序的生命周期hooks是什么？ Angular 2组件/指令具有

08

Angular2：从AngularJS 1.x 中学到的经验

本文选自《迈向Angular 2》，让我们看看Angular2解决了哪些在1.x版本中困扰我们的问题。

01

angular5面试题_大数据面试题

Angular 更新还是非常快的，目前（2020）的速度是每年2个主版本。网上也有不少面试题，不过很多都是针对老的版本，尤其是AngularJS的。因为最近在看Angular的面试题，所以特意总结一下。下面内容都是基于Angular v8.0以上的。

02

前端三大框架vue，angular，react大杂烩

摘要：从angular的诞生独步天下，到现在三大框架平分天下，基本形势已经趋于稳定。每一个框架从诞生到受欢迎，都有其特定的原因和背景。不同的开发者选择时，也是依据于其特定情景下的原因和背景。一、为什么前端会被vue,angular,react瓜分？不知道大家有没有发现，这三个框架除了都是前端框架之外，还大有搞基的成分存在。注意他们三个的名字，分别以v，a，r 开头，我这么一说，你是不是忽然间就想到了什么。哈哈，正是如此，将他们组合起来不就是javascript中无处不在的鬼东西么？var

06

前端三大框架vue，angular，react大杂烩

摘要：从angular的诞生独步天下，到现在三大框架平分天下，基本形势已经趋于稳定。每一个框架从诞生到受欢迎，都有其特定的原因和背景。不同的开发者选择时，也是依据于其特定情景下的原因和背景。一、为什么前端会被vue,angular,react瓜分？不知道大家有没有发现，这三个框架除了都是前端框架之外，还大有搞基的成分存在。注意他们三个的名字，分别以v，a，r 开头，我这么一说，你是不是忽然间就想到了什么。哈哈，正是如此，将他们组合起来不就是javascript中无处不在的鬼东西么？var

09

前端三大框架大杂烩

摘要：从angular的诞生独步天下，到现在三大框架平分天下，基本形势已经趋于稳定。每一个框架从诞生到受欢迎，都有其特定的原因和背景。不同的开发者选择时，也是依据于其特定情景下的原因和背景。一、为什么前端会被vue,angular,react瓜分？不知道大家有没有发现，这三个框架除了都是前端框架之外，还大有搞基的成分存在。注意他们三个的名字，分别以v，a，r 开头，我这么一说，你是不是忽然间就想到了什么。哈哈，正是如此，将他们组合起来不就是javascript中无处不在的鬼东西么？var(当然纯属于

05

Angular DOM 抽象概述

为了能够支持跨平台，Angular 通过抽象层封装了不同平台的差异，统一了 API 接口。如定义了抽象类 Renderer2 、抽象类 RootRenderer 等。此外还定义了以下引用类型：ElementRef、TemplateRef、ViewRef 、ComponentRef 和 ViewContainerRef 等。

03

Angular2 之结构型指令几个概念

两种用法。（* 与 template）控制宿主元素的模板。在哪里去显示，viewcontain 怎么注入，属性的set语法的使用，是便捷的监听属性值变化的途径。

02

Angular 中结构指令模式 - 它们是什么且怎么使用

在 Angular 中，有两种类型的指令。属性指令修改 DOM 元素的外观或者行为。结构指令添加或者移除 DOM 元素。

02

浅谈Angular

AngularJS 是一个 JavaScript框架。它是一个以 JavaScript 编写的库。它可通过 <script> 标签添加到HTML 页面。

01

Angular2 ：从 beta 到 release4.0 版本升级总结

一、版本说明原始版本： 2.0.0-beta.6 目标版本： 4.1.1 新增脚手架： Angular-cli 脚手架版本： 1.0.0-rc.1 升级后主要依赖版本如下： "dependenci

00

进阶 | 重新认识Angular

| 导语本文跟随着Angular的变迁聊聊这个框架，分享一些基础的介绍，以及个人的理解。也用过其他框架，像React和Vue。但与Angular结识较深，或许也是缘分吧。谈谈Angular ---- 内容概要数据绑定 (updated) 模块化组织 (new) 依赖注入路由和lazyload (new) Rxjs (new) 预编译AOT (new) 拥抱变化，迎接未来 updated: 原有特性，有更新 new: 新增特性 ---- 数据绑定 ---- 常用模版绑定常用模版引擎 1. S

01

Angular2 初体验

Angular2 已经发布 beta9 ，是时候折腾一下了。 Angular2 和 AngularJS 1.x 相比，可以说是全新的框架，除了名字有延续性之外，能延续的真的不多。

02

AngularDart 4.0 高级-结构指令顶

本指南介绍Angular如何用结构指令操纵DOM，以及如何编写自己的结构指令来完成相同的操作。

02

AngularDart4.0 指南- 模板语法二顶

Class绑定语法类似于属性(property)绑定。以前缀类开始，可选地跟一个点（.）和一个CSS类的名字替代括号内的元素属性：[class.class-name]。

02

【Appetite】ionic3实录（七）次页实现及分析解决问题【下】

一般一些js插件，是依托dom的。我们观察initSwiper方法，第一个参数'.wheel .swiper-container'其实是个选择器，所以它也是依托dom操作的，此外，由于我们使用了数据绑定，this.vm.dessertSlides的值更新会影响到dom，所以应该在数据更新从而使得dom更新完成后再调用initSwiper方法。 angular的脏检测机制是基于一定条件和时间的，在给this.vm.dessertSlides赋值，dom还没更新完成就调用initSwiper方法不一定会获得想要结果的，所以在此之前调用手动检测方法this.cd.detectChanges()强制检测并刷新dom。

02

干货 | 前端模板引擎知多少

“ 前端框架日新月异，而其中的数据绑定已经作为一个框架最基础的功能。我们常常使用的单向绑定、双向绑定、事件绑定、样式绑定等，里面具体怎么实现，而当我们数据变动的时候又会触发怎样的底部流程呢？ ” 模板数据绑定数据绑定的过程其实不复杂： 1. 解析语法生成AST。 2. 根据AST结果生成DOM。 3. 将数据绑定更新至模板。解析语法生成AST 抽象语法树（Abstract Syntax Tree）也称为AST语法树，指的是源代码语法所对应的树状结构。也就是说，对于一种具体编程语言下的源代码，通过构

03

Angular2 @Component

它的配置更简单一些，非常适合组件化的app架构。使用web组件和使用Angular风格的app架构使得编写app更为简便。

02

Angular2学习笔记

阴差阳错，当初在选择写网站的时候选择了使用Angular2+RESTfulｌ，现在想起来，这个选择可能有点轻率了。虽然这套框架我个人觉得可能的确比较适合做移动端Web的开发，但是由于网站开发的经验明显不足，加上这套技术还不是相当的成熟，在学习的过程中走了很多的弯路。而且，功利一点的讲，对于找工作的帮助可能并不是很大，很多Web相关的职务招的都是Java方向的，而我直接跳过这种传统框架直接接触新知识难免会发现基础不牢的情况。不过还好，经过这一段时间的倒腾，好歹把Angular2的东西稍微消化了一点，相比啥都不会，也算是有点收获吧。

01

Angular2 学习第一天

directives数组包含组件模板依赖的组件或指令 providers数组包含组件依赖的服务

02

angular教程推荐

angular系列在线交互式教程： angular5教程 angular5教程全面系统地讲解了最新版的Angular5，内容不仅涵盖组件模板语法、指令和管道运用、表单运用、指令开发等基础内容，还包括依赖注入原理与应用、变化检测机制原理及应用、模块和组件的编译过程解析、视图结构等进阶技能。教程内容深入浅出、循序渐进，即适合有一定Angular基础的工程师提高学习，也适合没有接触过Angular的工程师从零学起。 angular2教程即使你没有任何AngularJS的基础，学完angular2教程也可以轻松开

02

Angular2 返回时组件生命周期函数不被调用的解决方法

这两天使用 Angular2 遇到的一个 @angular/router 的 bug：

04

揭秘程序员眼中的 Vue 与 Angular | 码云周刊第 32 期

揭秘程序员眼中的 Vue 与 Angular 一基于 Vue 的项目 1. 项目名称：基于 Vue.js 的 UI 组件库项目简介：iView 是一套基于 Vue.js 的 UI 组件库，主要服

05

使用angular4和asp.net core 2 web api做个练习项目(二), 这部分都是angular

完成client.service.ts: import { Injectable } from '@angular/core'; import { Http, Headers } from '@angular/http'; import { Observable } from 'rxjs/Observable'; import { ErrorHandler } from '@angular/core'; import 'rxjs/add/operator/map'; import 'rxjs/add/ope

05

为生产环境编译 Angular 2 应用

Angular 2 已经发布了 2.1.2 版本，相信很多人已经在使用（试用）了，相比 AngularJS 1.x ， Angular 2 在性能上有了长足的进步，同时 Angular 2 也变得非常的庞大，动辄几兆的脚本，如何部署到生产环境？接下来就介绍如何为生产环境编译 Angular 2 应用，在本文中，我们将 Angular 2 官方文档中的 Hello Angular 应用编译到 50K 以下，以用于生产环境。

03

Angular企业级开发(1)-AngularJS简介

AngularJS介绍 AngularJS是一个功能完善的JavaScript前端框架，同时是基于MVC(Model-View-Controller理念的框架，使用它能够高效的开发桌面web app和移动端应用。AngularJS由Google公司开发而且开源出来，给所有开发者使用。前端基于Bootstrap+AngularJS框架，后端基于RESTful服务框架开发的应用越来越多。未来后端基于Docker+Microservice部署的应用也会越来越多。 AngularJS官方网站 Angular

08

AngularDart4.0 指南- 显示数据顶

您可以通过将HTML模板中的控件绑定到Angular组件的属性来显示数据。在这个页面中，您将创建一个包含英雄列表的组件。您将显示英雄名单的列表，并有条件地在列表下方显示一条消息。最终的用户界面如下所示：

01

【组件篇】ionic3开源组件

平时会留意一些开源组件，收藏到收藏夹里，然后一天mac电脑因为卸载window出问题导致不能不重装，然后里面的东西都没了，特别是适用于ionic2布局的angular2和普通js……so sad，现整理回一些并分享下：

04

Angular 13 发布：全面弃用 View Engine

当地时间 11 月 4 日，Angular 团队宣布 Angular 13 发布。此版本核心更新包括不再支持旧编译和渲染引擎 View Engine，全面支持新编译和渲染引擎 lvy，以及不再支持 IE11，除此之外还有包括对 APF 以及 Angular CLI 等方面的更新和修改。

02

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭