Angular SVG内容加载器

Angular SVG内容加载器
插件名称 svg-content-loader
发布时间 2020年5月21日
插件作者 NetanelBasal

一个使用SVG创建加载程序集合的Angular组件,该加载程序集合将模拟将要加载的内容的结构,类似于Facebook卡加载程序。

安装:

# Yarn
$ yarn add @netbasal/content-loader

# NPM
$ npm install @netbasal/content-loader --save

使用:

import { ContentLoaderModule } from '@ngneat/content-loader';

@NgModule({
  imports: [ContentLoaderModule]
})
export class AppModule {}
<content-loader>
<svg:rect x="0" y="0" rx="3" ry="3" width="250" height="10" />
<svg:rect x="20" y="20" rx="3" ry="3" width="220" height="10" />
<svg:rect x="20" y="40" rx="3" ry="3" width="170" height="10" />
<svg:rect x="0" y="60" rx="3" ry="3" width="250" height="10" />
<svg:rect x="20" y="80" rx="3" ry="3" width="200" height="10" />
<svg:rect x="20" y="100" rx="3" ry="3" width="80" height="10" />
</content-loader>

Facebook风格

<facebook-content-loader></facebook-content-loader>

清单样式

<list-content-loader></list-content-loader>

项目符号列表样式

<bullet-list-content-loader></bullet-list-content-loader>