【问题标题】:Jhipster entity how to use it on pageJhipster实体如何在页面上使用
【发布时间】:2020-12-16 15:28:32
【问题描述】:

我正在学习一些全栈的东西。我创建了一个 JHipster 项目并创建了一个名为 Post 的实体,其中我有一些字段,例如主题、正文和帖子作者的姓名。模型正在工作,我可以添加新帖子。问题是我想把实体放在主页上,就像博客一样。 这是我的主页:

<div class="row">
    <div class="col-md-3">
        <span class="hipster img-fluid rounded"></span>
    </div>

    <div class="col-md-9">
       <h1>Welcome to JBlog!</h1>
        <div *ngFor="let post of posts">
            <h2>{{post.title}}</h2>
            <p [innerHTML]="post.body"></p>
         <small>Written By: {{post.author}}</small>
            <hr/>
        </div>
    </div>
</div>

这是我的component.ts


import { Component, OnInit, OnDestroy } from '@angular/core';
import {Post} from "app/shared/model/post.model";
import {PostService} from "app/entities/post/post.service";
import {ResponseWrapper} from "app/shared/model/response-wrapper.model";

@Component({
selector: 'jhi-home',
templateUrl: './home.component.html',
styleUrls: ['home.scss'],
})
export class HomeComponent implements OnInit {

posts: Post[] = [];

constructor(private postService: PostService) {

}

ngOnInit() {
 console.log("ngOnInit...")
 this.loadAll();
}

loadAll() {
 this.postService.query().subscribe(
   (res: ResponseWrapper) => {
     console.log(res.json);
     this.posts = res.json;
   },
   (res: ResponseWrapper) => {
     console.log(res.json);
   }
 );
}

}

function loadAll() 是从一个教程中复制的,该教程在版本 4 中是一个角度,我的是 9,它不起作用。我添加了一个类响应包装器,但我不确定我应该放什么,有人能告诉我如何开始这样的任务吗?响应应该是怎样的。 我正在粘贴响应包装器,但我知道它无效。


export class ResponseWrapper {
constructor(
 public headers: Headers,
 public json: any,
 public status: number
) { }
}

感谢您的帮助!

【问题讨论】:

    标签: angular jhipster


    【解决方案1】:

    改用 HttpResponse。

        loadAll(): void {
        this.postService.query().subscribe(
          (res: HttpResponse<any>) => {
            // console.log(res);
            this.posts = res.body;
          },
          (res: HttpResponse<any>) => {
            // console.log(res);
          }
        );
      }
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2015-07-25
      • 2016-10-22
      • 1970-01-01
      • 2017-07-12
      相关资源
      最近更新 更多