簡體   English   中英

從 spring 引導獲取 angular 中的 json

[英]Fetching json in angular from spring boot

{"inprog":[{"type":"op","host":"DESKTOP-CFDEE20:27017","desc":"conn2","connectionId":2,"client":"127.0.0.1:57742","clientMetadata":{"driver":{"name":"mongo-java-driver","version":"3.4.3-dirty"},"os":{"type":"Windows","name":"Windows 10","architecture":"amd64","version":"10.0"},"platform":"Java/Oracle Corporation/11.0.7+8-LTS"},"active":true,"currentOpTime":"2020-12-15T18:45:29.395+05:30","opid":365405,"secs_running":0,"microsecs_running":666,"op":"command","ns":"admin.$cmd.aggregate","command":{"currentOp":true,"$db":"admin"},"numYields":0,"locks":{},"waitingForLock":false,"lockStats":{},"waitingForFlowControl":false,"flowControlStats":{}},{"type":"op","host":"DESKTOP-CFDEE20:27017","desc":"WTJournalFlusher","active":true,"currentOpTime":"2020-12-15T18:45:29.395+05:30","opid":365404,"op":"none","ns":"","command":{},"numYields":0,"locks":{},"waitingForLock":false,"lockStats":{},"waitingForFlowControl":false,"flowControlStats":{}},{"type":"op","host":"DESKTOP-CFDEE20:27017","desc":"WTCheckpointThread","active":true,"currentOpTime":"2020-12-15T18:45:29.395+05:30","opid":365143,"op":"none","ns":"","command":{},"numYields":0,"locks":{},"waitingForLock":false,"lockStats":{},"waitingForFlowControl":false,"flowControlStats":{}}],"ok":1.0}

我從 spring 引導中獲取此數據

import { Component, OnInit } from '@angular/core';
import { DbviewService } from 'src/app/services/dbview.service';

@Component({
  selector: 'app-dbview-details',
  templateUrl: './dbview-details.component.html',
  styleUrls: ['./dbview-details.component.css']
})
export class DbviewDetailsComponent implements OnInit {
 
  dbdetail:any;  
  
  constructor(private dbviewservice:DbviewService ) { }

  ngOnInit() {
    this.retrievedbdetails;
  }

  retrievedbdetails() {
    this.dbviewservice.getAll()
      .subscribe(
        data => {
          this.dbdetail = data;
          console.log(data);
        },
        error => {
          console.log(error);
        });
        console.log(this.dbdetail);
  }


}

這是我的組件

<div class="row">
    <div class="col-md-6">
      {{dbdetail}}
        <div *ngFor="let dbs of dbdetail;">
        <div *ngFor="let db of dbs;">
        <h4>Db</h4>
        <div>
          <label><strong>Title:</strong></label> {{ db.active }}
        </div>
        <div>
          <label><strong>Description:</strong></label>
          {{ db.desc }}
        </div>
        </div>
       
      </div>
  
      
    </div>
  </div>

這是我的 html

除了導航欄,什么都沒有顯示。 console.log 語句未顯示在控制台中。 我如何從 spring 啟動 api 獲取 json 文件

在您的代碼中沒有調用retrievedbdetails function。 請添加()執行function :)

ngOnInit() {
    this.retrievedbdetails(); // add () here
  }

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM