问题标签 [angular2-changedetection]

我正在尝试创建一个简单的示例项目来测试 angular 2 更改检测机制：我在主索引页面上的脚本标签中创建了一个纯 javascript 对象。它包含以下内容：

一个用于控制台记录的功能，一个用于更改文本属性的功能。

现在在 Angular 2 中，代码如下所示：

我要做的是：当我通常使用 onclick 调用函数 Tryout.printme() 时（完全在角度之外），我希望角度来检测变化并更新屏幕。

我成功地做到了这一点：当我从组件调用 Tryout.printme() 时（changeme() 函数正在调用 Tryout.printme()），Angular 会检测到更改并更新 UI，这很好。此外，当我从外部角度更改并从 Angular 调用 consoleLogMe() 时，它会记录更改的文本并更新 UI。

我想我需要在 Angular 以某种方式运行的同一个区域中执行 Tryout.changeme() 。有任何想法吗？我有一个用纯 javascript/jquery 完成的大项目，现在我需要慢慢地将车把模板重写为 angular2 组件而不触及模型（还）。为此，我需要强制模型在与角度相同的区域中执行。

如果我想在 Angular 1 中做这样的事情，我只需 $scope.$apply 就可以了。

这是示例中的 gif：

在 AngularJS 中，您可以$watch使用$scope. 在 Angular 中观察变量变化（例如，在组件变量中）的等价物是什么？

我正在编写一个具有属性的 Angular 组件Mode(): string。

我希望能够以编程方式设置此属性，而不是响应任何事件。

问题是在没有浏览器事件的情况下，模板绑定{{Mode}}不会更新。

有没有办法手动触发这种变化检测？

如何强制组件在 Angular 2 中重新渲染？出于调试目的，我想强制一个组件重新渲染它的视图，这可能吗？

async尝试通过使用管道的角度 2 组件中的流在窗口调整大小时呈现窗口大小：

<h2>Size: {{size$ | async | json}}</h2>

但是组件只呈现初始状态并忽略流更新。如果您打开控制台，在调整窗口大小时，您将看到来自同一流的更新。

无法理解我在这里缺少什么。

这是一个笨蛋

我正在创建一个调用 Facebook javascript api 的 Facebook 服务，并且想知道在我的值更新时如何最好地实现更改检测。

我有UserService一个currentUser属性是 BehaviorSubject：

当我想更新用户以响应 facebook javascript sdk 告诉我用户已登录或注销时，我会更新它并需要tick()调用ApplicationRef：

在我的组件中，我将来自用户服务的“currentUser”存储在构造函数中并绑定到 value 属性：

难道我做错了什么？有没有比在从外部库触发更改后必须调用 ApplicationRef.tick() 更好的方法？

编辑

我尝试使用 NgZone 并且它不起作用，使用不同的事件将提要中的帖子作为服务页面返回：

控制台显示计数递增，但仅当我添加调用时 html 绑定{{posts.length}}才会更新...ref.tick()

我想我在某处看到您可以从顶级应用程序组件中为任何组件提供“输入”，这可能是登录用户的方式，但不是其他调用，例如在提要中获取帖子......

我有一个简单的属性指令mask，带有@Input() mask:string

我希望能够检测到mask我可以以某种方式使用的绑定的变化并做出反应ngOnChanges，但我觉得这就像用大刷子画问题

指令的示例/简化代码：

用法：

当值发生someBinding变化时，如何执行一些代码，而不依赖于ngChanges？

在我用 Dart 编写的 Angular2 应用程序中，我有几个服务可以跟踪在视图中不一定具有任何特定关系的组件之间共享的数据。我需要任何组件发起的更新都反映在每个组件的显示中，我想要OnPush更改检测的性能优势，我需要组件显示在创建组件之前可能已经设置的值，并且我希望完成所有这些用最少的样板。

我的研究表明 Observables 可能是我需要的，但我一直无法在几个方面找到明确的答案。

Dart 中是否有与 Angular2 配合良好的 Observable 实现？

Observable 与 Dart Stream 有什么不同吗？特别是 Observable 是否支持获取当前值以及收到有关未来更新的通知？

最后但并非最不重要的一点是，假设 Observable 满足我的要求，声明组件的 Observable String 属性、使用从注入服务中检索到的 Observable 对其进行初始化、在组件的模板中显示其值（以 pre -existing value），并且对其值的更新会自动标记组件以进行推送更改检测？

如果 Observable 对此不起作用，我应该怎么做呢？我目前的想法是使用一个自定义Stream子类，该子类在新侦听器接收到的任何其他内容之前插入最新值，并通过async管道发送该值以处理从流中提取值并标记以进行更改检测。

我理想的解决方案在使用中看起来像这样：

在模板中：

或者对于真正理想的情况，尽管这必须以某种方式挂钩到 Angular 的模板编译中（也许使用转换器？我还没有了解它们是如何工作的）：

就这样，它就可以工作了。

我现在使用的自定义解决方案没有那么方便，但它很接近。

可能我错过了一些关于变更检测的 Angular2 概念。

我读过关于 NgZones 和 ChangeDetectionStrategy 但似乎没有一个能解决我的问题。

情况是我有一个外部模块，我在其中存储我的 Observables 并在某些组件中使用它们，当其中一个组件将某些内容更改为服务时，它会传播到其他组件。

我写了一个 Plunker 来帮助表达我的问题

http://plnkr.co/edit/ieHnm0ikBe4BR5w6O1XE?p=preview

在那里，我有src/MyService.ts一个Subject使用setInterval.

仅在您单击具有空单击处理程序的按钮时才会呈现其值Subject。src/app.ts

src/MyService.ts

src/app.ts

这可能是我自己对 Angular 2 更改检测如何工作的误解，但我原以为如果组件ChangeDetectionStrategy设置为或Checked，则该组件只会在组件实例化时检查更改一次。它似乎不会以这种方式发生。CheckOnceDetached

单击时，我本来希望切换hasThing属性，但我不希望视图会更新。碰巧的是，视图确实会更新。ChangeDetectionStrategy设置为Detached也时发生。

http://plnkr.co/edit/2hHdt2BDpj419Z32iPjJ?p=preview

我在这里想念什么？究竟是什么导致视图更新？从我所见，无论我更新hasThing属性，视图都会在单击时更新，无论值是否已更改。