彩票走势图

logo telerik中文文档

条形码类型


立即下载Kendo UI for Angular

Kendo UI for Angular条码支持多种一维(1D)工业条码。

要配置条形码符号(编码方案),请设置type属性。

下表列出了每种条形码的可用类型和支持的值,请注意校验和数字是自动计算的,并且所有类型值也可以用小写字母拼写。

提示:如果值与所选类型的限制不匹配,Barcode将抛出错误。始终使用您期望在实际使用中看到的值来测试应用程序。

文件

下面的例子演示了每种条形码类型的作用:

条形码
条形码
条形码
条形码
条形码

查看源代码:

  • app.component.ts
import { Component } from '@angular/core';
import { BarcodeType } from '@progress/kendo-angular-barcodes';

@Component({
selector: 'my-app',
styles: [`
.cards {
display: flex;
flex-wrap: wrap;
gap: 16px;
}

.k-card {
flex: 0 0 auto;
}

.k-barcode {
width: 300px;
height: 100px;
}

.k-card-title {
font-family: sans-serif;
}
`],
template: `
<div class="cards">
<div class="k-card k-text-center"
*ngFor="let item of allBarcodes">
<div class="k-card-header">
<div class="k-card-title">
{{ item.name }}
</div>
</div>
<div class="k-card-body">
<kendo-barcode [type]="item.type" [value]="item.value">
</kendo-barcode>
</div>
</div>
</div>
`
})
export class AppComponent {
public allBarcodes: {
type: BarcodeType;
name: string;
value: string;
}[] = [
{ type: 'EAN13', name: 'EAN-13', value: '123456789012' },
{ type: 'EAN8', name: 'EAN-8', value: '1234567' },

{ type: 'UPCA', name: 'UPC-A', value: '12345678901' },
{ type: 'UPCE', name: 'UPC-E', value: '123456' },

{ type: 'Code11', name: 'Code 11', value: '555-123' },

{ type: 'Code39', name: 'Code 39', value: 'CODE-39' },
{ type: 'Code39Extended', name: 'Code 39 (Extended)', value: '* Code-39 *' },

{ type: 'Code93', name: 'Code 93', value: 'CODE 93' },
{ type: 'Code93Extended', name: 'Code 93 (Extended)', value: '* Code 93 *' },

{ type: 'Code128', name: 'Code 128', value: '* Code 128 *' },
{ type: 'Code128A', name: 'Code 128A', value: '* CODE 128 *' },
{ type: 'Code128B', name: 'Code 128B', value: '* Code 128 *' },
{ type: 'Code128C', name: ' Code 128C', value: '112233' },

{ type: 'GS1-128', name: 'GS1-128', value: '00123456780000000001' },

{ type: 'MSImod10', name: 'MSI (Mod 10)', value: '1234567' },
{ type: 'MSImod11', name: ' MSI (Mod 11)', value: '1234567' },
{ type: 'MSImod1010', name: 'MSI (Mod 1010)', value: '1234567' },
{ type: 'MSImod1110', name: 'MSI (Mod 1110)', value: '1234567' },

{ type: 'POSTNET', name: 'POSTNET', value: '12345' }
];
}
  • app.module.ts:
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { BrowserModule } from '@angular/platform-browser';
import { BarcodesModule } from '@progress/kendo-angular-barcodes';
import { ButtonsModule } from '@progress/kendo-angular-buttons';

import { AppComponent } from './app.component';

@NgModule({
imports: [ BrowserModule, BarcodesModule, ButtonsModule, FormsModule ],
declarations: [ AppComponent ],
bootstrap: [ AppComponent ]
})

export class AppModule { }
  • main.ts:
import './polyfills';
import { enableProdMode } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';

import { AppModule } from './app.module';

enableProdMode();

const platform = platformBrowserDynamic();
platform.bootstrapModule(AppModule);
扫码咨询


添加微信 立即咨询

电话咨询

客服热线
023-68661681

TOP