无法理解 zone.js 示例

Question

这是演示 here 的 zone.js 功能的代码：

Zone.current.fork({}).run(function () {
    Zone.current.inTheZone = true;

    setTimeout(function () {
        console.log('in the zone: ' + !!Zone.current.inTheZone);
    }, 0);
});

console.log('in the zone: ' + !!Zone.current.inTheZone);

以上会记录：

'in the zone: false'

'in the zone: true'

我真的不明白那个区域在这里做什么，它与 this video 谈论的拦截事件有什么关系。

它第一次输出 false 因为 Zone.current.inTheZone 是 undefined，并且因为我们改变了 Zone.current.inTheZone = true; 这是第二次输出的值。 zone 在这里有什么特别的？

Answer 1

区域允许您在区域中封装的异步操作中保留一些属性。所以基本上这里它表明没有 inTheZone 属性附加到当前区域。但是，当您执行 zone.fork().run() 时，回调将在新的分叉区域中执行，并且异步任务 setTimeout 也将在该分叉区域中执行。您将在该区域内获得 inTheZone 属性，但在其他区域将无法访问。这可能是一个更好的例子：

Zone.current.fork({}).run(function () {
    Zone.current.inTheZone = true;

    setTimeout(function () {
        console.log('in the zone: ' + !!Zone.current.inTheZone); // true
    }, 2000);
});

setTimeout(function () {
    console.log('in the zone: ' + !!Zone.current.inTheZone); // false
}, 1000);

如您所见，这里有两个异步任务。并且当前区域的 setTimeout 将早于分叉区域的超时执行。 run() 是同步的，因此在执行第一个 setTimetout 之前应将 inTheZone 设置为 true。但它被记录为 false 因为当前区域无法从分叉区域访问属性。

无法理解 zone.js 示例

Can't understand zone.js example

javascript

angular2-zone

angular