值更改时不调用 ngOnChange

2023-12-11

我已经设置了plunk

我正在单击按钮和单击时更改对象的 bool 属性ngOnchange应该触发但没有发生。为什么?。是否与父组件和子组件之间共享相同的对象引用有关?


角度变化检测仅检查对象身份。
如果修改对象的内容,Angular 将无法识别。
如果你有一个到对象属性或数组项的绑定,Angular 会检查绑定思想,但是ngOnChanges仍然不会被调用。

这种设计的原因是性能。如果 Angular 需要进行深度对象比较,则更改检测将成为更大的性能负担。

解决方法是复制对象或数组,以创建具有不同对象 ID 的新对象。角度变化检测会将其识别为变化并更新到子组件的绑定。

  this.data.status = !this.data.status
  this.data = Object.assign({}, this.data);

或对于数组

  this.data = this.data.slice();

笨蛋的例子

其他方式正在实施DoCheck在子组件中并自己进行比较,而不是依赖于更改检测。

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

值更改时不调用 ngOnChange 的相关文章

  • 使用 @Input() 时出现 TypeScript 错误

    我正在尝试使用 Angular 4 开发一个应用程序 但是我在使用时收到一条错误消息 Input inputProducts products Product 错误是 tslint 在 ProductListComponent 类中 指令输
  • 接近堆限制的无效标记压缩分配 Angular 8 - JavaScript 堆内存不足

    42 构建 274 275 模块 1 个活动模块 src index js 提取 D Clients app node modules sass loader lib loader js ref 15 3 D src styles scss
  • 基于角色在同一路径上延迟加载模块

    我正在尝试根据我的角色加载 Angular 模块 当我登录时 我用 Angular Guard 尝试过 但这不起作用 当它失败时 它不会转到下一条路线 const routes Routes path loadChildren gt Aut
  • Angular Service Worker 路线

    我已经使用 Angular Service Worker 构建了一个应用程序 除了路线之外 它在离线状态下运行良好 如果我转到基本网址 应用程序加载正常 但如果我在离线状态下转到任何其他路线 则会收到离线错误 我的 ngsw manifes
  • 提供常量

    Provide 在 RC4 中已被弃用 以前 我可以这样做 provide API URL useValue address 我正在尝试这样的事情 provide API URL useValue address 但这不起作用 我找到了几个
  • 如何在控制台中访问 Angular2 组件特定数据?

    有没有办法在控制台中访问 Angular2 特定组件的特定数据以进行调试 就像 Angular1 能够在控制台中访问其组件值一样 更新4 0 0 StackBlitz 示例 https stackblitz com edit angular
  • 如何在 *ngFor 中停止属性绑定到 Angular 中的每个元素

    在我的 html 中 我想将属性绑定应用于每个元素 我有一个点击和悬停事件 每当用户 将鼠标悬停或单击单个元素 但现在悬停或 单击发生在其中的每个元素上 ngFor 我想要它只 发生在他们选择 悬停的元素上 我需要什么 改变 我看到了另一个
  • 在非 Angular 类中获取注入的依赖项

    我有当前的 和简化的 课程 export class NavigationItem constructor private router Router navigateTo this router navigate this id 我不想每
  • 如何配置 Angular2 Quickstart 来运行 phantomjs?

    我想弄清楚如何运行测试Angular2 快速入门 https github com angular quickstart与 phantomjs 我认为这些步骤足以配置 Karma 1 克隆存储库 git clone https github
  • 获取路由查询参数

    我正在尝试从 rc1 迁移到 rc4 但在获取查询字符串参数时遇到问题 ActivatedRoute 对象始终为空 英雄组件 ts import Component OnInit from angular core import Contr
  • 方法与管道

    在 Angular 应用程序中的模板插值中使用管道和方法有区别吗 例如 h1 name toLowerCase h1 vs h1 name lowercase h1 就性能而言 是有真正的收获还是只是个人喜好 我知道调用模板中的方法通常会降
  • Angular - 通用服务的提供者

    我已经为我的 HTTP API 创建了一个通用服务 并且我想为不同的端点提供此服务 而无需为每个端点创建一个类 我的服务看起来像这样 export class ApiService
  • 为什么 Angular takeuntil ngUnsubscribe 之前有一个“下一步”?

    有大量关于使用 takeUntil 运算符取消订阅流的信息 如下所示 export class CategoryOptionInputComponent constructor private svc MyService protected
  • Spring-Security + Angular 2 + CORS。无法重定向 Facebook 登录

    我正在构建一个在前端使用 Angular 2 在后端使用 Spring Boot 的应用程序 我正在使用 Spring Security 和 Spring Social 来允许通过 Facebook 登录 我以为我已正确配置 CORS 但收
  • 验证以防止角度形式出现重复的形式值

    我有几个表单数组 我需要进行验证 以便每个表单行中的特定字段在所有表单数组中必须是唯一的 如果任何值出现多次 则两个表单字段都必须标记为红色 我设法编写了一个函数 以便如果这些字段有任何更改 该函数将返回 true false 但我不确定如
  • 如何在 Angular 中实现全局加载器

    我有一个全局加载器 其实现如下 核心模块 router events pipe filter x gt x instanceof NavigationStart subscribe gt loaderService show router
  • @angular/router 3.0.0-alpha.3:如何迁移OnActivate

    我刚刚将 angular router 升级到 3 0 0 alpha 3 但是 我找不到 2 0 0 rc 1 中提供的 OnActivate 接口 任何提示表示赞赏 因为我们还没有任何文档 并将在接下来的几周内提供 你想要一个提示 这是
  • 为 Angular 2 配置history.pushState

    我的 Angular 2 应用程序使用默认值HTML 5 history pushState https developer mozilla org en US docs Web API History API Adding and mod
  • Angular 15 参考错误:初始化前无法访问“组件 A”

    我在相互导入独立组件时遇到一个问题 成分A Component standalone true selector app a templateUrl a component html styleUrls a scss imports BCo
  • Angular 4 中的箭头函数(Lambda 函数)

    我对lambda知之甚少 lambda表达式被视为一个函数 我们有很多方法可以做到这一点 这是我的简单功能TypeScript file byPan card1 card2 return card1 pan card2 pan 我在 HTM

随机推荐

  • 我应该输入类型吗?

    创建变量时应该指定类型吗 仅仅声明关键字 var 有什么缺点吗 这两者有什么区别吗 var a 0 int a 0 优点缺点 ONGOING WORK 最佳实践 推荐使用var or final关键字 不指定类型注释 并隐式推断类型已知局部
  • 使用pyHook获取鼠标坐标以便稍后播放

    我正在编写一段代码来使用 pyHook 收集鼠标单击信息 然后使用 win32api 来访问单击函数 本质上 我试图使用鼠标来记录点击模式 以便稍后记录和回放 这是我现在的代码 import win32api win32con time w
  • 如何让网络工作者同时执行多项任务?

    我试图让 Web Worker 管理其状态 同时服务多个异步请求 工人 ts 文件 let a 0 this is my worker s state let worker self as unknown as Worker worker
  • 在 shell 中将星号转义为 Java 命令行参数

    我在 shell 中使用星号作为 Java 命令行参数时遇到了问题 我可以将这个问题的描述简化如下 首先 有一个简单的 java 程序 它打印命令行参数 public class CmdArgsTest public static void
  • C++ long 到 double 的可移植转换

    我需要准确地将长表示位转换为双精度 我的解决方案应可移植到不同的体系结构 能够跨编译器成为标准 如 g 和 clang 也很棒 我正在编写一个快速近似来计算 exp 函数 如建议的那样这个问题的答案 double fast exp doub
  • 使用jquery AJAX提交表单[重复]

    这个问题在这里已经有答案了 我正在尝试使用 jQuery ajax 提交表单 但我的数据没有发布到 PHP 它返回空数组 POST array 这是我的代码 这是我的表格
  • 参数嗅探

    假设我们有一个具有 6 个参数 性能不佳的存储过程 如果六个参数之一传输到存储过程中的局部变量 是否足以禁用参数嗅探 或者是否有必要将传递到存储过程的所有 6 个参数传输到存储过程中的局部变量 根据 Paul White 的评论 将变量分配
  • 如何在中国访问谷歌地图API

    我正在使用 google 地图 api 来获取我的 IBM Mobilefirst 项目中的用户位置 它在除中国之外的所有国家 地区都按预期工作正常 我知道这是因为中国已阻止在其国家 地区访问 google api 是否有任何解决方法我可以
  • 文本到语音转换

    我们正在制作 iPhone 应用程序 客户希望通过语音消息进行提醒 要求是用户设置他们想要提醒的时间和文字 使用文本 我将转换为语音并在触发提醒时播放音频文件 为此 我计划使用谷歌服务 播放这些文本并下载相同的音频文件 NSString u
  • Ruby on Rails - 是否可以通过 /app/assets/images 中的表单保存图像?

    我正在为一家销售二手车的小商店开发一个小型 Rub y on Rails 应用程序 该网站包含所有可用汽车的列表 包括汽车的图像 店内最多有20辆车 我读到 将图像直接保存在数据库中并不是最佳实践 最好使用 Amazon Web Servi
  • 字典格式的键错误“0”

    我仍然是 Python 的初学者 我想知道为什么会这样 dict dict 0 123 a 0 if dict format a format a 1 print True 给我一个关键错误 0 但不是这个 dict dict 0 123
  • 谷歌地图在每个外部链接位置显示多个标记点击而不刷新页面

    我想显示 Google 地图以固定每个位置的多个商店 例如 位置是 Chennai Trichy 班加罗尔 海得拉巴 如果我单击链接钦奈 地图将仅显示钦奈的多个商店 如果我点击 Trichy 链接 地图将仅在 Trichy 中显示多个商店
  • 使用 Outlook 日历 REST API 设置活动组织者

    我正在使用 Outlook REST API 创建事件并发送邀请 基于this文档 我对登录用户进行身份验证 并通过请求的授权标头及其内容上的 json 格式事件发送其承载令牌 如果我将 组织者 设置为另一用户而不是经过身份验证的用户 并将
  • 退出时如何保存 Activity 的状态?安卓

    我有一个基本的应用程序 其中包含文本输入 旋转器输入和第二个旋转器输入 其数组取决于 选项 菜单中更改的设置 目前 当我在应用程序中按 Home 或按 Return 时 我要么返回桌面 要么循环返回最近输入的旧输入 如何防止我的应用程序打开
  • ascx 用户控件中的事件处理

    从用户控件到父控件 页面通信事件的最佳实践是什么我想做类似的事情 MyPage aspx
  • Cordova 插件仅在 iOS 中第二次打开时有效,并出现线程警告。如何让插件初始化 onload?

    我的 iOS 应用程序中的 Cordova 插件仅在您打开应用程序 返回主屏幕将其关闭 然后重新打开应用程序后才起作用 然后 XCode 日志中会显示一条线程警告 2014 05 14 14 00 38 062 TLEMobile 2881
  • EF 4.1 RC:奇怪的级联删除

    我不得不承认 EF 4 1 RC Codefirst DataAnnotations 和 FluentAPI 的功能仍然让我难以抗拒 有时我真的不知道自己在做什么 请参阅以下 POCO public class Country Key pu
  • 当函数运行时写入 easygui 文本框?

    我目前正在使用 easygui 运行脚本来接收用户输入 在命令行中运行的旧脚本只会在命令行中打印用户需要知道的任何内容 但我已将其更改为在需要输入时在新的 easygui 框中输出通知 我想要做的是获得进度 正在运行的函数内的每个操作在完成
  • Next js 嵌套动态路由:通过 getstaticprops 获取数据,并在路由之间共享数据

    我正在尝试构建一个带有嵌套动态路由和路由之间共享数据的 next js 应用程序 文件结构如下所示 pages level1 level1 id js index js level2 level2 id js index js Level2
  • 值更改时不调用 ngOnChange

    我已经设置了plunk 我正在单击按钮和单击时更改对象的 bool 属性ngOnchange应该触发但没有发生 为什么 是否与父组件和子组件之间共享相同的对象引用有关 角度变化检测仅检查对象身份 如果修改对象的内容 Angular 将无法识