sqlite - 使用 sqlite 作为 angular v7 的数据库

Question

我正在使用 Angular 构建一个小型 SPA，由于我是 Angular 新手，所以我使用 Angular 教程作为我的应用程序的路线图。一切正常，直到从 sqlite 数据库检索数据(由于实现限制，无法使用任何其他类型的后端代码)。本教程( https://angular.io/tutorial/toh-pt6 )使用内存数据库，显然不适合我。我想要从 sqlite 检索数据并可以注入(inject)到组件的服务

组件

   import { Component, OnInit } from '@angular/core';
   import { Areport } from '../../classess/areport';
   import { ReportService } from "../../services/report.service";
@Component({
  selector: 'app-daily-report',
  templateUrl: './daily-report.component.html',
  styleUrls: ['./daily-report.component.css']
})
export class DailyReportComponent implements OnInit {
  reports : Areport[];
  constructor(private reportService: ReportService) { }
  getReports(): void {
    this.reportService.getReports()
        .subscribe( reports => this.reports = reports)
  }
  ngOnInit() {
    this.getReports();
  }
}

报告服务

import { Injectable } from '@angular/core'; 
import { Observable, of } from "rxjs";
import { Areport } from "../classess/areport";
import { MessageService } from "./message.service";
import { SqlitedbService } from "./sqlitedb.service";

@Injectable({   providedIn: 'root' })


export class ReportService {

  constructor( private messageService: MessageService) { } 
  getReports(): Observable<Areport[]>{
    this.messageService.add('reportService: fetched reports');
    return of(SqlitedbService.R()); 


} 

sqlite服务

import { Injectable } from '@angular/core';
const  sqlite3 = require('sqlite3').verbose();

let db = new sqlite3.Database('../../db/my.db');
let reports : any
db.all("SELECT * FROM reports",[],(err:any,rows:any)=>{
  reports=rows;
})

@Injectable({
  providedIn: 'root'
})
export class SqlitedbService {

  constructor(){}
  R(){ return reports};
}

我找不到任何类型的教程来使用 angular excet this ( https://github.com/leota/electron-angular4-sqlite3/blob/master/src/app/app.component.ts) 中的 sqlite，我不知道它在做什么，或者也不值得尝试添加更多层，例如电子

对我来说理想的是某种类型的类函数，我可以在我的服务中使用它来返回一些查询结果并执行插入语句

这段 js 代码在 node 中也可以正常工作，但我不知道如何在 angular 中使用它

var sqlite3 = require('sqlite3').verbose();
var db = new sqlite3.Database('./my.db')
db.each("SELECT * FROM reports", function(err, row)  {
  console.log(err+"   "+row.id + ": " + row.txt);
    });

Answer 1

我找到了以下教程:https://appdividend.com/2019/06/04/angular-8-tutorial-with-example-learn-angular-8-crud-from-scratch/

在本教程中，他使用 mongoDb，但我用 sqlite3 替换了 mongodb:

sqlite 必须在您的应用程序的后端。因此，在项目的根目录下创建一个 api 文件夹并执行 npm init -y

npm install express body-parser cors --save

安装 sqlite npm install sqlite3 --save

安装 nodemon : npm install nodemon --save-dev 和 npm install -g nodemon

创建一个 server.js

const express = require('express'),
path = require('path'),
bodyParser = require('body-parser'),
cors = require('cors'),
sqlite3 = require('sqlite3').verbose();

var db = new sqlite3.Database(':memory:');

db.serialize(function () {
    db.run("CREATE TABLE lorem (info TEXT)");

    var stmt = db.prepare("INSERT INTO lorem VALUES (?)");
    for (var i = 0; i < 10; i++) {
        stmt.run("Ipsum " + i);
    }

    stmt.finalize();

    db.each("SELECT rowid AS id, info FROM lorem", function (err, row) {
        console.log(row.id + ": " + row.info);
    });
});

db.close();

const app = express();
let port = process.env.PORT || 4000;

const server = app.listen(function () {
    console.log('Listening on port ' + port);
});

使用 nodemon ./server.js 启动你的服务器
结果是:

监听 4000 端口
1:Ipsum 0
2:Ipsum 1
3:Ipsum 2
4:Ipsum 3
5:Ipsum 4
6:Ipsum 5
7:Ipsum 6
8:Ipsum 7
9:Ipsum 8
10:Ipsum 9