Question

我正在构建一个带有角度的小型SPA，由于我对角度不熟悉，因此我将角度教程用作应用的路线图。在从sqlite数据库中检索数据之前，所有事情都可以找到（由于实施限制，无法使用任何其他类型的后端代码）。教程（https://angular.io/tutorial/toh-pt6）使用了一个内存数据库，这显然不适合我。我想拥有从sqlite检索数据并可以注入到组件的服务

组件

   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();
  }
}

reportService

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};
}

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

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

这段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安装sqlite3-保存
安装nodemon：npm安装nodemon --save-dev和npm install -g nodemon
创建一个server.js

const express = require（'express'），   路径= require（'路径'），   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（？）”）;   对于（var i = 0; i <10; i ++）{     stmt.run（“ Ipsum” + i）;   }   stmt.finalize（）;

db.each（“ SELECT rowid AS id，info from lorem”，函数（错误，行）{     console.log（row.id +“：” + row.info）;   }）; }）;

db.close（）;

const app = express（）; 让端口= process.env.PORT || 4000;

常量服务器= app.listen（function（）{   console.log（'监听端口'+端口）; }）;
使用nodemon ./server.js启动服务器结果是：

在端口4000上监听 1：益普森0 2：Ipsum 1 3：益宝2 4：Ipsum 3 5：Ipsum 4 6：Ipsum 5 7：Ipsum 6 8：益宝7 9：Ipsum 8 10：Ipsum 9

最好的问候

使用sqlite作为angular v7的数据库

1 个答案: