zone.js

import 'zone.js'; // Ensure zone.js is loaded to patch global APIs // The global Zone object is now available console.log(`Initial Root Zone Name: ${Zone.current.name}`); // Create a new zone with custom properties const requestScopedZone = Zone.current.fork({ name: 'requestZone', properties: { requestId: 'req-' + Math.random().toString(36).substring(2, 9) } }); console.log(` Starting a new request simulation...`); // Run a synchronous task within the new zone requestScopedZone.run(() => { const currentRequestId = Zone.current.get('requestId'); console.log(` Inside requestZone (sync): Request ID = ${currentRequestId}`); // Schedule an asynchronous task. Zone.js patches setTimeout to preserve context. setTimeout(() => { // This callback will automatically run within 'requestScopedZone' console.log(` Inside requestZone (async setTimeout): Request ID = ${Zone.current.get('requestId')}`); if (Zone.current.get('requestId') === currentRequestId) { console.log(' Async context correctly preserved!'); } }, 50); // Another async operation (e.g., a Promise) Promise.resolve().then(() => { console.log(` Inside requestZone (async Promise): Request ID = ${Zone.current.get('requestId')}`); }); }); console.log(` Back in Root Zone: Current Zone Name = ${Zone.current.name}`); // Demonstrating another independent zone const userContextZone = Zone.current.fork({ name: 'userContextZone', properties: { userId: 'user-' + Math.floor(Math.random() * 1000) } }); userContextZone.run(() => { console.log(` Inside userContextZone: User ID = ${Zone.current.get('userId')}`); setTimeout(() => { console.log(` Inside userContextZone (async): User ID = ${Zone.current.get('userId')}`); }, 20); });