???? ?????? Zone.js ?-Angular ??? ??? ?-Angular 17

???? ?????? Zone.js ?-Angular ??? ??? ?-Angular 17

Zone.js ??? ?????? ?????? ?-Angular ?????? ?? ?????? ??????? ???????????. ??? ????? ???? ?? "????" ????? ??? ?????? ???, ??????? ??????? ????? ???????? ?? Angular ????? ????? ?????. ????? ???? Zone.js

????? ????? ??????????? ?? Zone.js

???? Zone.js

???? Zone.js, ????? ?????? ??????????? ?-JavaScript ??? ??????? ?????? ????? ??????, ??? ???? ?? ???? ?????? ????? ??????.

????? ????:

function fetchDataAndUpdateUI() {
  fetch('/api/data')
    .then(response => response.json())
    .then(data => {
      setTimeout(() => {
        document.getElementById('data').innerText = data.value;
      }, 1000);
    })
    .catch(error => console.error('Error:', error));
}

fetchDataAndUpdateUI();        

?????? ??, ?????? ??????? ??????????? ??????? ?????? ????? ????? ?????? ?????? ?????? ??????? ????????.

?? Zone.js

Zone.js ???? ????? ???????? ?????? ???????????, ????? ?? ?????? ????? ???????? ?? Angular ?????? ?? ????? ????? ????.

????? ?????:

import { Component, OnInit } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Observable } from 'rxjs';

@Component({
  selector: 'app-data',
  template: '<div id="data">{{ data }}</div>'
})
export class DataComponent implements OnInit {
  data = 'Initial Data';

  constructor(private http: HttpClient) {}

  ngOnInit() {
    this.fetchDataAndUpdateUI().subscribe((response: any) => {
      this.data = response.value;
    });
  }

  fetchDataAndUpdateUI(): Observable<any> {
    return this.http.get('/api/data');
  }
}        

???, Zone.js ????? ?? ??????? ???????????? ????????, ??????? ?????? ?????? ???????? ????????? ??????. Angular ?????? ?-Zone.js ????? ????? ?????? ????? ????????, ?? ????? ?? ?????? ????? ????? ????.

??????? ?-Angular 17

Angular 17 ????? ???? ??????? ?-Zone.js, ?????? ?? ??????? ????????? ???:

  1. ??????????? ?? ????? ???????: ?????????? ????? ??????? ?? ????? ?? ????? ????????, ?? ????? ?? ???????? ??????? ????????? ????.
  2. ????? ?????? ??????: ????? ?????? ????? ???? ?????? ?????? ???? ?????? ???? ???? ??????.
  3. ????? ???????: ?????? ??????? ?????, ??? ????? ?????? ????? ??????? ???????, ?????? ?? ???????? ??????? ????.

??????? ??? ????? ?? ????? ?????? Angular ???? ??????? ??????.

??? ?-RxJS

????? ?-Zone.js ?-RxJS ????? ?????? ??????? ???????????, ?? ?????? ????? ?????:

  • Zone.js: ???? ?? ???? ?? ?????? ???????????, ?????? ?????? ???????? ?? Angular ????? ?????.
  • RxJS: ???? ?????? ???? ?????? ??????? ??????????? ??????? ??????? ??????? ???? ??????.

?-Angular, ?????? ??? ?????? ????? ???. ??????, RxJS ???? ???? ??????? ?????????? ??????, ???? Zone.js ????? ????? ??????? ?????? ?????.

????? ?????? ?????:

import { Component, OnInit } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Observable } from 'rxjs';

@Component({
  selector: 'app-data',
  template: '<div id="data">{{ data }}</div>'
})
export class DataComponent implements OnInit {
  data = 'Initial Data';

  constructor(private http: HttpClient) {}

  ngOnInit() {
    this.fetchDataAndUpdateUI().subscribe((response: any) => {
      this.data = response.value;
    });
  }

  fetchDataAndUpdateUI(): Observable<any> {
    return this.http.get('/api/data');
  }
}        

???, RxJS ???? ????? ?-HTTP, ???? Zone.js ?????? ?????? ?????? ???????? ????????? ??????.

???? ????? ?? Angular 17

???? ?? ??????? ????????? ?????? ?-Angular 17, ???? ???? Zone.js ???? ???? ?? ?????? ??????? ??????????? ????? ?? ???????? ????????? ???.

#Angular #Angular17 #ZoneJS #AICode #TomerKedemQuiz


要查看或添加评论,请登录