Question

我有一个快速的后端，其中已将用户头像存储在mongodb中。现在我想将其显示给我的客户端（7号角），其中将有一个div，我的计划是使用background-image:url()。在网址中将进行http调用。这是代码：

   <mat-card class="container">
        <div
          [ngStyle]="{
            'background-image': 'url(' + myIdentity.avatar_url + ')'
          }"
        >
        </div>
        <mat-card-header>
          <mat-card-title>{{ myIdentity.firstName }}</mat-card-title>
          <mat-card-subtitle>({{ myIdentity.lastName }})</mat-card-subtitle>
        </mat-card-header>

        <mat-card-content>
          Joined Date:
          {{ myIdentity.createdAt | date: 'medium' }}</mat-card-content
        >
      </mat-card>

这是html中的样子。似乎一切都很好..但是仍然看不到克林特方面的任何东西。

<div _ngcontent-c12="" ng-reflect-ng-style="[object Object]" style="background-image: url(http://localhost:3000/avater/Karim)"></div>

如果我使用div而不是image tag，那么它的工作绝对没问题。但是我想使用div。请让我知道我怎么能做到这一点？

这是我从后端发送图像的方式：

app.get('/avater/:filename', (req, res) => {
      console.log(req.params.filename)
      if (req.params) {
        gfs.files.findOne({ 'filename.avaterName': req.params.filename }, (err, files) => {
          // Error checking
          if (!files || files.length === 0) {
            return res.status(404).json({
              responseCode: 1,
              responseMessage: 'error'
            });
          }

          var readstream = gfs.createReadStream({
            filename: files.filename
          });
          // set the proper content type
          res.set('Content-Type', files.contentType);
          // Return response
          return readstream.pipe(res);
        });

如何从http调用中以角度显示图像？

0 个答案: