angular - TypeScript: Veri erişim katmanı oluşturmanın en iyi yolu

İyi öğleden sonra, şu anda kullanıcı internet erişimine sahip olduğunda bağlı, sahip olmadığında ise bağlantısız olarak iki bağlantı modu yöneten bir uygulamayı Angular kullanarak Ionic'te oluşturuyorum.

Şu anda bir özellik var ve bu, kullanıcının bağlı modda olması durumunda bir API çağırması gerektiği, aksi takdirde SQLite'taki sorgulara çağrı yapması gerektiğidir:

component.ornek.ts

getUsers () {
  this.dataLayer.getUsers().subscribe (...)
}

veri-erisim-katmani.ts

getUsers () {
  if (this.connectionMode == 'online') {
     this.httpcliente.post (...)
  } else {
     this.sqliteclient.query ("...")
  }
}

Benim sorum, bu stratejiyi uygulamanın en iyi yolu ne olurdu, çünkü bağlantının bir mi yoksa diğer mi olduğunu doğrulamak için koşullar oluşturma yöntemi bana en iyisi gibi görünmüyor ya da belki bir enum kullanmak.

enum AccessDataSqLite {
   getUsers = "...",
   getData = "...",
}

Bu stratejiyi uygulamanın daha iyi bir yolu, referanslar veya bağlantı gönderebilirseniz memnun olurum.

Çok teşekkür ederim

Cevap #1

Bu davranışı oluşturmak istiyorsanız, Strategy desenini basitçe uygulayabilirsiniz

Örnek :

import { Injectable } from "@angular/core";
import { fromEvent, merge } from "rxjs";
import { startWith, map } from "rxjs/operators";

interface Strategy {
  getData1(): any;
  anotherMethod(): any;
}

class SQLStrategy implements Strategy {
  getData1() {
    console.log("SQl", "getData1");
  }

  anotherMethod() {
    console.log("SQl", "anotherMethod");
  }
}

class HTTPStrategy implements Strategy {
  getData1() {
    console.log("HTTP", "getData1");
  }

  anotherMethod() {
    console.log("HTTP", "anotherMethod");
  }
}

@Injectable()
export class DataLayerService {
  private strategy;

  constructor() {
    // init strats
    const sqlStrategy = new SQLStrategy();
    const httpStrategy = new HTTPStrategy();

    merge(fromEvent(window, "online"), fromEvent(window, "offline"))
      .pipe(
        startWith(1),
        map(x => navigator.onLine)
      )
      .subscribe(x => {
        console.log("navigator.onLine", x);
        this.strategy = x ? httpStrategy : sqlStrategy;
      });
  }

  public getData1() {
    this.strategy.getData1();
  }

  public anotherMethod() {
    this.strategy.anotherMethod();
  }
}

Stackblitz: https://stackblitz.com/edit/angular-ivy-fggs4r?file=src/app/data-layer.service.ts

İlgili makaleler