小编Iva*_*S95的帖子

我只能使用CSS创建此形状吗?

我正在为具有特定形状的网页构建英雄部分,此刻,我只是将图像用作实际部分背景的叠加层,但我希望减少提出的请求数量,想知道是否可以使用CSS完成以下形状:

在此处输入图片说明

因此,黑色部分是实际图像所在的位置,而白色部分是我尝试使用CSS构建的部分;

html css css-shapes

3
推荐指数
1
解决办法
145
查看次数

如何在 Angular 应用程序中导入 PDFMake 的自定义字体?

我刚刚开始阅读 PDFMake 的文档,以便在我的 Angular 应用程序中构建文档,我遇到了一些类似这样的问题,但从未得到答案。

我想知道是否有人知道或可以提供一个可读的示例,说明如何在 Angular 应用程序中导入 PDFMake 的自定义字体,我已经下载了“Lato”字体的文件,但我不知道现在该往哪里继续。

我确实导入了库,如文档中所示:

import pdfMake from 'pdfmake/build/pdfmake';
import pdfFonts from 'pdfmake/build/vfs_fonts';
pdfMake.vfs = pdfFonts.pdfMake.vfs;
Run Code Online (Sandbox Code Playgroud)

我还看到了一个例子,其中进行了如下附加声明:

pdfMake.fonts = {
  Lato: {
    normal: 'assets/fonts/Lato-Regular.ttf'
  }
};
Run Code Online (Sandbox Code Playgroud)

当然,这告诉我只需定义字体的名称、字体的粗细,并指向该特定字体的文件位置;但之后我不知道如何实际告诉 PDFMake 使用该字体。

感谢任何帮助,我一段时间以来一直在努力寻找解决方案。

编辑:按照文档,我能够通过直接修改 pdfmake node_modules 目录中找到的文件来使用 Lato 字体,它可以工作,但我想避免对 node_modules 进行更改,因为我无法保留跟踪这些更改或在不同计算机上运行项目时使它们可用。

pdf pdf-generation typescript pdfmake angular

3
推荐指数
2
解决办法
1万
查看次数

bootstrap-vue 切换扩展表行

这似乎仍然没有答案,所以这里是另一种解决方案的尝试。

目前在 bootstrap-vue 中,我正在渲染一个 b-table. 我想通过能够选择一行并折叠/展开额外的 div/row/etc 以显示更多信息来改进这一点。

在下面的片段中,您将看到我正在尝试的内容。问题是我似乎无法获得扩展数据以跨越表中的列数。我试过添加,<tr><td colspan="6"></td></tr>但它似乎没有像我期望的那样跨越。任何解决方法?谢谢。

<b-table
    :items="case.cases"
    :fields="tableFields"
    head-variant="dark">
    <template
        slot="meta.status"
        slot-scope="data">
    <b-badge
        v-b-toggle.collapse1
        :variant="foobar"
        tag="h6">
        {{ data.value }}
    </b-badge>
    </template>
    <template
        slot="@id"
        slot-scope="data">
        <span
            v-b-toggle.collapse1>
            {{ data.value }}
        </span>
        <b-collapse id="collapse1">
            Collapse contents Here
        </b-collapse>
    </template>
</b-table>`
Run Code Online (Sandbox Code Playgroud)

vue.js bootstrap-4 bootstrap-vue

2
推荐指数
2
解决办法
1万
查看次数

如何检查“材料角度”中的“菜单”是否打开?

我正在寻找一种检查我的菜单mat-menu是否打开的方法,因此我可以根据菜单的状态向button打开它的类中添加一个类[ngClass]

<button mat-stroked-button mdbWavesEffect [matMenuTriggerFor]="menu">Actions</button>
    <mat-menu #menu="matMenu" [overlapTrigger]="false" panelClass="custom">
        <a routerLink="/attendence/detail" mat-menu-item>View Attendance</a>
        <a routerLink="/adherence/detail" mat-menu-item>View Adherece</a>
        <button mat-menu-item>Edit Agent</button>
        <button mat-menu-item>Upload photo</button>
        <button mat-menu-item>Deactivate Agent</button>
    </mat-menu>
Run Code Online (Sandbox Code Playgroud)

css typescript angular-material angular

1
推荐指数
1
解决办法
4475
查看次数

使用 Bulma CSS 将卡片居中

我目前正在为番茄计时器构建一个应用程序,我使用 Bulma 作为 CSS 框架,到目前为止我很喜欢它,我仍在学习 Flexbox 的工作原理,我想知道什么是最好的解决这种情况的方法,以及是否可以仅使用 Bulma 类来完成,或者我是否必须创建自己的类。

在此输入图像描述

我正在尝试为添加的每个任务创建“卡片”,但我希望它们的宽度约为全屏宽度的一半或更少。我不明白如何使用 Bulma 实现这一点,因为所有内容都只占用完整宽度,而且我不能将所有内容居中,因为它没有硬编码宽度。这是我包含任务卡的部分的代码。

 <div class="section">
     <div class="task-container is-center">
         <div class="card is-clearfix is-1-touch" style="margin-bottom: 10px" v-for="task in tasks" :key="task.id">
             <input type="checkbox" class="checkbox">
             <span class="has-text-left">
                     {{task.desc}}
             </span>
             <span class="icon is-pulled-right has-text-danger"><i class="far fa-times-circle"></i></span>
             <span class="icon is-pulled-right has-text-primary"><i class="far fa-play-circle"></i></span>
         </div>
     </div>
 </div>
Run Code Online (Sandbox Code Playgroud)

任何帮助、提示、建议等,我们将不胜感激!

html css flexbox responsive-design bulma

1
推荐指数
1
解决办法
7729
查看次数

Angular 6+ /错误回调上重试服务调用?

我有一个服务调用的实现,它可能会引发错误,如果出现错误,是否可以重新运行该服务调用?

captureMultiScreen(elem: Alert, overwrite: boolean, success?: Function, failed?: Function) {
this.spinnerValue = true;
const captureModel: Capture = {
  member_id: elem.member_id,
  gateway: elem.gateway,
  account: elem.account,
  alert_id: elem.alert_id,
  transaction_id: elem.transaction_id,
  overwrite: overwrite
};

this.captureService.CaptureScreenService(captureModel).subscribe(result => {
  this.capServiceResponse = result;
},
(error) => {
  // Retry "CaptureScreenService" here
}
Run Code Online (Sandbox Code Playgroud)

如果到达错误回调,是否有办法再次运行服务调用?

xmlhttprequest observable rxjs typescript angular

0
推荐指数
1
解决办法
417
查看次数