1<!doctype html><html lang="en" data-beasties-container><head> 2 <meta charset="utf-8"> 3 <meta name="viewport" content="width=device-width,initial-scale=1"> 4 <link rel="preconnect" href="https://gw.alipayobjects.com" crossorigin="anonymous"> 5 <link rel="preconnect" href="https://img.alicdn.com" crossorigin="anonymous"> 6 <link rel="preconnect" href="https://cdnjs.cloudflare.com" crossorigin="anonymous"> 7 <link rel="preconnect" href="https://vars.hotjar.com"> 8 <link rel="preconnect" href="https://script.hotjar.com"> 9 <link rel="preconnect" href="https://www.google-analytics.com"> 10 <link rel="dns-prefetch" href="https://www.google-analytics.com"> 11 <link rel="preconnect" href="https://cdn.jsdelivr.net"> 12 <link rel="preconnect" href="https://api.github.com"> 13 <link rel="preload" href="https://script.hotjar.com/font-hotjar_5.65042d.woff2" as="font" type="font/woff2" crossorigin> 14 15 <meta name="apple-mobile-web-app-capable" content="yes"> 16 <meta name="apple-mobile-web-app-status-bar-style" content="translucent"> 17 <meta name="mobile-web-app-capable" content="yes"> 18 <meta name="keywords" content="angular, ant design, ant, angular ant design, web, ui, components, ng, zorro, responsive, typescript, css, mobile web, open source, ç»ä»¶åº, ç»ä»¶, UI æ¡æ¶, Getting Started"> 19 <meta name="author" content="NG-ZORRO Team"> 20 <meta name="description" content="Ant Design of Angular is dedicated to providing a good development experience for programmers.The prerequisite of Ant Design Angular is a solid backgr..."> 21 <!--Twitter card metadata--> 22 <meta name="twitter:card" content="summary"> 23 <meta name="twitter:site" content="@ng_zorro"> 24 <meta name="twitter:creator" content="@ng_zorro"> 25 <meta name="twitter:title" content="Getting Started | NG-ZORRO"> 26 <meta name="twitter:description" content="Ant Design of Angular is dedicated to providing a good development experience for programmers.The prerequisite of Ant Design Angular is a solid backgr..."> 27 <meta name="twitter:image" content="https://ng.ant.design/assets/img/site-preview.png"> 28 <!--Open Graph--> 29 <meta property="og:url" content="https://ng.ant.design/"> 30 <meta property="og:type" content="website"> 31 <meta property="og:title" content="Getting Started | NG-ZORRO"> 32 <meta property="og:site_name" content="NG-ZORRO - Ant Design Of Angular"> 33 <meta property="og:locale" content="en_US"> 34 <meta property="og:description" content="Ant Design of Angular is dedicated to providing a good development experience for programmers.The prerequisite of Ant Design Angular is a solid backgr..."> 35 <meta property="og:image" content="https://ng.ant.design/assets/img/site-preview.png"> 36 <meta property="og:image:secure_url" content="https://ng.ant.design/assets/img/site-preview.png"> 37 <meta property="og:image:type" content="image/png"> 38 <meta property="og:image:width" content="2048"> 39 <meta property="og:image:height" content="1536"> 40 <meta name="theme-color" content="#1890ff"> 41 42 <link rel="icon shortcut" href="https://img.alicdn.com/tfs/TB1Jr2ASQvoK1RjSZFDXXXY3pXa-200-200.png" type="image/x-icon"> 43 <link rel="apple-touch-icon" sizes="180x180" href="assets/icons/apple-icon-180.png"> 44 <link rel="apple-touch-icon" sizes="167x167" href="assets/icons/apple-icon-167.png"> 45 <link rel="apple-touch-icon" sizes="152x152" href="assets/icons/apple-icon-152.png"> 46 <link rel="apple-touch-icon" sizes="120x120" href="assets/icons/apple-icon-120.png"> 47 <link rel="manifest" href="manifest.json"> 48 <title>Getting Started | NG-ZORRO</title> 49 <base href="/"> 50 <!-- Hotjar Tracking Code for ng.ant.design --> 51
51<script>!function(t,h,e,j,s,n){t.hj=t.hj||function(){(t.hj.q=t.hj.q||[]).push(arguments)},t._hjSettings={hjid:792689,hjsv:6},s=h.getElementsByTagName("head")[0],(n=h.createElement("script")).async=1,n.src="https://static.hotjar.com/c/hotjar-"+t._hjSettings.hjid+".js?sv="+t._hjSettings.hjsv,s.appendChild(n)}(window,document)</script>
51 52 53 <style>.preload *{-webkit-transition:none!important;-moz-transition:none!important;-ms-transition:none!important;-o-transition:none!important}</style> 54 <style>html{--ant-primary-color:#1890ff;--ant-primary-color-hover:#40a9ff;--ant-primary-color-active:#096dd9;--ant-primary-color-outline:rgba(24, 144, 255, .2);--ant-primary-1:#e6f7ff;--ant-primary-2:#bae7ff;--ant-primary-3:#91d5ff;--ant-primary-4:#69c0ff;--ant-primary-5:#40a9ff;--ant-primary-6:#1890ff;--ant-primary-7:#096dd9;--ant-primary-color-deprecated-pure: ;--ant-primary-color-deprecated-l-35:#cbe6ff;--ant-primary-color-deprecated-l-20:#7ec1ff;--ant-primary-color-deprecated-t-20:#46a6ff;--ant-primary-color-deprecated-t-50:#8cc8ff;--ant-primary-color-deprecated-f-12:rgba(24, 144, 255, .12);--ant-primary-color-active-deprecated-f-30:rgba(230, 247, 255, .3);--ant-primary-color-active-deprecated-d-02:#dcf4ff;--ant-success-color:#52c41a;--ant-success-color-hover:#73d13d;--ant-success-color-active:#389e0d;--ant-success-color-outline:rgba(82, 196, 26, .2);--ant-success-color-deprecated-bg:#f6ffed;--ant-success-color-deprecated-border:#b7eb8f;--ant-error-color:#ff4d4f;--ant-error-color-hover:#ff7875;--ant-error-color-active:#d9363e;--ant-error-color-outline:rgba(255, 77, 79, .2);--ant-error-color-deprecated-bg:#fff2f0;--ant-error-color-deprecated-border:#ffccc7;--ant-warning-color:#faad14;--ant-warning-color-hover:#ffc53d;--ant-warning-color-active:#d48806;--ant-warning-color-outline:rgba(250, 173, 20, .2);--ant-warning-color-deprecated-bg:#fffbe6;--ant-warning-color-deprecated-border:#ffe58f;--ant-info-color:#1890ff;--ant-info-color-deprecated-bg:#e6f7ff;--ant-info-color-deprecated-border:#91d5ff}[class*=ant-] input::-ms-clear,[class*=ant-] input::-ms-reveal,[class^=ant-] input::-ms-clear,[class^=ant-] input::-ms-reveal{display:none}body,html{width:100%;height:100%}input::-ms-clear,input::-ms-reveal{display:none}*,:after,:before{box-sizing:border-box}html{font-family:sans-serif;line-height:1.15;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;-ms-overflow-style:scrollbar;-webkit-tap-highlight-color:transparent}body{margin:0;color:#000000d9;font-size:14px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-variant:tabular-nums;line-height:1.5715;background-color:#fff;font-feature-settings:"tnum"}[tabindex="-1"]:focus{outline:0!important}h1,h2,h3,h4{margin-top:0;margin-bottom:.5em;color:#000000d9;font-weight:500}p{margin-top:0;margin-bottom:1em}input[type=text]{-webkit-appearance:none}ul{margin-top:0;margin-bottom:1em}blockquote{margin:0 0 1em}strong{font-weight:bolder}a{color:var(--ant-primary-color);text-decoration:none;background-color:transparent;outline:0;cursor:pointer;transition:color .3s;-webkit-text-decoration-skip:objects}a:hover{color:var(--ant-primary-color-hover)}a:active{color:var(--ant-primary-color-active)}a:active,a:hover{text-decoration:none;outline:0}a:focus{text-decoration:none;outline:0}code,pre{font-size:1em;font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,Courier,monospace}pre{margin-top:0;margin-bottom:1em;overflow:auto}img{vertical-align:middle;border-style:none}a,button,input:not([type=range]){touch-action:manipulation}button,input{margin:0;color:inherit;font-size:inherit;font-family:inherit;line-height:inherit}button,input{overflow:visible}button{text-transform:none}button{-webkit-appearance:button}button::-moz-focus-inner{padding:0;border-style:none}[hidden]{display:none!important}.clearfix:before{display:table;content:""}.clearfix:after{display:table;clear:both;content:""}.anticon{display:inline-flex;align-items:center;color:inherit;font-style:normal;line-height:0;text-align:center;text-transform:none;vertical-align:-.125em;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.anticon>*{line-height:1}.anticon svg{display:inline-block}.anticon:before{display:none}html{--antd-wave-shadow-color:var(--ant-primary-color);--scroll-bar:0}nz-affix{display:block}.ant-anchor{box-sizing:border-box;margin:0;padding:0;color:#000000d9;font-size:14px;font-variant:tabular-nums;line-height:1.5715;list-style:none;font-feature-settings:"tnum";position:relative;padding-inline-start:2px}.ant-anchor-wrapper{margin-inline-start:-4px;padding-inline-start:4px;overflow:auto;background-color:transparent}.ant-anchor-ink{position:absolute;top:0;inset-inline-start:0;height:100%}.ant-anchor-ink:before{position:relative;display:block;width:2px;height:100%;margin:0 auto;background-color:#0000000f;content:" "}.ant-anchor-ink-ball{position:absolute;inset-inline-start:50%;display:none;width:8px;height:8px;background-color:#fff;border:2px solid var(--ant-primary-color);border-radius:8px;transform:translate(-50%);transition:top .3s ease-in-out}.ant-anchor-ink-ball:dir(rtl){transform:translate(50%)}.ant-anchor-link{padding-block:4px;padding-inline-start:16px}.ant-anchor-link-title{position:relative;display:block;margin-bottom:3px;overflow:hidden;color:#000000d9;white-space:nowrap;text-overflow:ellipsis;transition:all .3s}.ant-anchor-link-title:only-child{margin-bottom:0}nz-link{display:block}.ant-avatar{box-sizing:border-box;margin:0;padding:0;color:#000000d9;font-size:14px;font-variant:tabular-nums;line-height:1.5715;list-style:none;font-feature-settings:"tnum";position:relative;display:inline-block;overflow:hidden;color:#fff;white-space:nowrap;text-align:center;vertical-align:middle;background:#ccc;width:32px;height:32px;line-height:32px;border-radius:50%}.ant-avatar.ant-avatar-icon{font-size:18px}.ant-avatar.ant-avatar-icon>.anticon{margin:0}.ant-btn{line-height:1.5715;position:relative;display:inline-block;font-weight:400;white-space:nowrap;text-align:center;background-image:none;border:1px solid transparent;box-shadow:0 2px #00000004;cursor:pointer;transition:all .3s cubic-bezier(.645,.045,.355,1);-webkit-user-select:none;user-select:none;touch-action:manipulation;height:32px;padding:4px 15px;font-size:14px;border-radius:2px;color:#000000d9;border-color:#d9d9d9;background:#fff}.ant-btn>.anticon{line-height:1}.ant-btn,.ant-btn:active,.ant-btn:focus{outline:0}.ant-btn:not([disabled]):hover{text-decoration:none}.ant-btn:not([disabled]):active{outline:0;box-shadow:none}.ant-btn-sm{height:24px;padding:0 7px;font-size:14px;border-radius:2px}.ant-btn:focus,.ant-btn:hover{color:var(--ant-primary-color-hover);border-color:var(--ant-primary-color-hover);background:#fff}.ant-btn:active{color:var(--ant-primary-color-active);border-color:var(--ant-primary-color-active);background:#fff}.ant-btn:active,.ant-btn:focus,.ant-btn:hover{text-decoration:none;background:#fff}.ant-btn>span{display:inline-block}.ant-btn-text{color:#000000d9;border-color:transparent;background:0 0;box-shadow:none}.ant-btn-text:focus,.ant-btn-text:hover{color:var(--ant-primary-color-hover);border-color:var(--ant-primary-color-hover);background:0 0}.ant-btn-text:active{color:var(--ant-primary-color-active);border-color:var(--ant-primary-color-active);background:0 0}.ant-btn-text:focus,.ant-btn-text:hover{color:#000000d9;background:#00000005;border-color:transparent}.ant-btn-text:active{color:#000000d9;background:#00000007;border-color:transparent}.ant-btn:before{position:absolute;top:-1px;inset-inline-end:-1px;bottom:-1px;inset-inline-start:-1px;z-index:1;display:none;background:#fff;border-radius:inherit;opacity:.35;transition:opacity .2s;content:"";pointer-events:none}.ant-btn .anticon{transition:margin .3s cubic-bezier(.645,.045,.355,1)}.ant-btn:active>span,.ant-btn:focus>span{position:relative}.ant-btn:empty{display:inline-block;width:0;visibility:hidden;content:"\a0"}.ant-row{display:flex;flex-flow:row wrap;min-width:0}.ant-row:after,.ant-row:before{display:flex}.ant-col{position:relative;max-width:100%;min-height:1px}.ant-col-xs-24{display:block;flex:0 0 100%;max-width:100%}.ant-col-xs-0{display:none}@media(min-width:576px){.ant-col-sm-24{display:block;flex:0 0 100%;max-width:100%}.ant-col-sm-0{display:none}}@media(min-width:768px){.ant-col-md-24{display:block;flex:0 0 100%;max-width:100%}.ant-col-md-18{display:block;flex:0 0 75%;max-width:75%}.ant-col-md-6{display:block;flex:0 0 25%;max-width:25%}}@media(min-width:992px){.ant-col-lg-18{display:block;flex:0 0 75%;max-width:75%}.ant-col-lg-6{display:block;flex:0 0 25%;max-width:25%}.ant-col-lg-offset-6{margin-inline-start:25%}}@media(min-width:1200px){.ant-col-xl-19{display:block;flex:0 0 79.16666667%;max-width:79.16666667%}.ant-col-xl-5{display:block;flex:0 0 20.83333333%;max-width:20.83333333%}.ant-col-xl-offset-5{margin-inline-start:20.83333333%}}@media(min-width:1600px){.ant-col-xxl-20{display:block;flex:0 0 83.33333333%;max-width:83.33333333%}.ant-col-xxl-4{display:block;flex:0 0 16.66666667%;max-width:16.66666667%}
54.ant-col-xxl-offset-4{margin-inline-start:16.66666667%}}.ant-flex{display:flex}.ant-flex-justify-normal{justify-content:normal}.ant-flex-align-normal{align-items:normal}.ant-flex-wrap-wrap{flex-wrap:wrap}.ant-input{box-sizing:border-box;margin:0;font-variant:tabular-nums;list-style:none;font-feature-settings:"tnum";position:relative;display:inline-block;width:100%;min-width:0;padding:4px 11px;color:#000000d9;font-size:14px;line-height:1.5715;background-color:#fff;background-image:none;border:1px solid #d9d9d9;border-radius:2px;transition:all .3s}.ant-input::placeholder{color:#bfbfbf;-webkit-user-select:none;user-select:none}.ant-input:placeholder-shown{text-overflow:ellipsis}.ant-input:hover{border-color:var(--ant-primary-5);border-inline-end-width:1px}.ant-input:focus{border-color:var(--ant-primary-color-hover);box-shadow:0 0 0 2px var(--ant-primary-color-outline);border-inline-end-width:1px;outline:0}.ant-menu{box-sizing:border-box;margin:0;padding:0;font-variant:tabular-nums;line-height:1.5715;font-feature-settings:"tnum";padding-inline-start:0;color:#000000d9;font-size:14px;line-height:0;list-style:none;background:#fff;outline:0;box-shadow:0 3px 6px -4px #0000001f,0 6px 16px #00000014,0 9px 28px 8px #0000000d;transition:background .3s,width .3s cubic-bezier(.2,0,0,1) 0s}.ant-menu:before{display:table;content:""}.ant-menu:after{display:table;clear:both;content:""}.ant-menu.ant-menu-root:focus-visible{box-shadow:0 0 0 2px var(--ant-primary-2)}.ant-menu-item:active{background:var(--ant-primary-1)}.ant-menu-title-content{transition:color .3s}.ant-menu-item a{color:#000000d9}.ant-menu-item a:hover{color:var(--ant-primary-color)}.ant-menu-item a:before{position:absolute;inset:0;background-color:transparent;content:""}.ant-menu-horizontal .ant-menu-item{margin-top:-1px}.ant-menu-horizontal>.ant-menu-item:hover{background-color:transparent}.ant-menu-item-selected,.ant-menu-item-selected a,.ant-menu-item-selected a:hover{color:var(--ant-primary-color)}.ant-menu:not(.ant-menu-horizontal) .ant-menu-item-selected{background-color:var(--ant-primary-1)}.ant-menu-inline{border-inline-end:1px solid rgba(0,0,0,.06)}.ant-menu-horizontal .ant-menu-item{transition:border-color .3s,background .3s}.ant-menu-item{position:relative;display:block;margin:0;padding:0 20px;white-space:nowrap;cursor:pointer;transition:border-color .3s,background .3s,padding .3s cubic-bezier(.645,.045,.355,1)}.ant-menu-item:not(.ant-menu-item-disabled):focus-visible{box-shadow:0 0 0 2px var(--ant-primary-2)}.ant-menu-horizontal{line-height:46px;border:0;border-bottom:1px solid rgba(0,0,0,.06);box-shadow:none}.ant-menu-horizontal:not(.ant-menu-dark)>.ant-menu-item{margin-top:-1px;margin-bottom:0;padding:0 20px}.ant-menu-horizontal:not(.ant-menu-dark)>.ant-menu-item-selected,.ant-menu-horizontal:not(.ant-menu-dark)>.ant-menu-item:hover{color:var(--ant-primary-color)}.ant-menu-horizontal:not(.ant-menu-dark)>.ant-menu-item-selected:after,.ant-menu-horizontal:not(.ant-menu-dark)>.ant-menu-item:hover:after{border-bottom:2px solid var(--ant-primary-color)}.ant-menu-horizontal>.ant-menu-item{position:relative;top:1px;display:inline-block;vertical-align:bottom}.ant-menu-horizontal>.ant-menu-item:after{position:absolute;bottom:0;inset-inline:20px;border-bottom:2px solid transparent;transition:border-color .3s cubic-bezier(.645,.045,.355,1);content:""}.ant-menu-horizontal>.ant-menu-item a{color:#000000d9}.ant-menu-horizontal>.ant-menu-item a:hover{color:var(--ant-primary-color)}.ant-menu-horizontal>.ant-menu-item a:before{bottom:-2px}.ant-menu-horizontal>.ant-menu-item-selected a{color:var(--ant-primary-color)}.ant-menu-horizontal:after{display:block;clear:both;height:0;content:" "}.ant-menu-inline .ant-menu-item{position:relative}.ant-menu-inline .ant-menu-item:after{position:absolute;top:0;bottom:0;inset-inline-end:0;border-inline-end:3px solid var(--ant-primary-color);transform:scaleY(.0001);opacity:0;transition:transform .15s cubic-bezier(.215,.61,.355,1),opacity .15s cubic-bezier(.215,.61,.355,1);content:""}.ant-menu-inline .ant-menu-item{height:40px;margin-top:4px;margin-bottom:4px;padding:0 16px;overflow:hidden;line-height:40px;text-overflow:ellipsis}.ant-menu-inline .ant-menu-item:not(:last-child){margin-bottom:8px}.ant-menu-inline>.ant-menu-item{height:40px;line-height:40px}.ant-menu-inline{width:100%}.ant-menu-inline .ant-menu-item-selected:after{transform:scaleY(1);opacity:1;transition:transform .15s cubic-bezier(.645,.045,.355,1),opacity .15s cubic-bezier(.645,.045,.355,1)}.ant-menu-inline .ant-menu-item{width:calc(100% + 1px)}.ant-menu-inline.ant-menu-root .ant-menu-item{display:flex;align-items:center;transition:border-color .3s,background .3s,padding .1s cubic-bezier(.215,.61,.355,1)}.ant-menu-inline.ant-menu-root .ant-menu-item>.ant-menu-title-content{flex:auto;min-width:0;overflow:hidden;text-overflow:ellipsis}.ant-menu-inline.ant-menu-root .ant-menu-item>*{flex:none}.ant-menu-root.ant-menu-inline{box-shadow:none}.ant-menu-light .ant-menu-item:hover{color:var(--ant-primary-color)}.ant-menu.ant-menu-root:focus-visible{box-shadow:0 0 0 2px var(--ant-primary-7)}.ant-select-single.ant-select{height:32px;font-size:14px}.ant-select-single.ant-select .ant-select-selector{display:flex;flex:1 1 auto;border-radius:2px}.ant-select-single.ant-select .ant-select-selector .ant-select-selection-wrap:after{line-height:30px}.ant-select-single.ant-select .ant-select-selector .ant-select-selection-search{position:absolute;width:100%;inset:0}.ant-select-single.ant-select .ant-select-selector .ant-select-selection-search-input{width:100%;appearance:textfield}.ant-select-single.ant-select .ant-select-selector .ant-select-selection-item{display:block;align-self:center;padding:0;line-height:30px;transition:all .3s,visibility 0s}.ant-select-single.ant-select .ant-select-selector .ant-select-selection-item:after,.ant-select-single.ant-select .ant-select-selector:after{display:inline-block;width:0;visibility:hidden;content:"\a0"}.ant-select-single.ant-select.ant-select-show-arrow .ant-select-selection-item,.ant-select-single.ant-select.ant-select-show-arrow .ant-select-selection-search{padding-inline-end:18px}.ant-select-single.ant-select:not(.ant-select-customize-input) .ant-select-selector{align-items:center;width:100%;height:100%;padding:0 11px}.ant-select-single.ant-select:not(.ant-select-customize-input) .ant-select-selector .ant-select-selection-search-input{height:30px;font-size:14px}.ant-select-single.ant-select:not(.ant-select-customize-input) .ant-select-selector:after{line-height:30px}.ant-select-single.ant-select-sm{height:24px;font-size:14px}.ant-select-single.ant-select-sm .ant-select-selector{display:flex;flex:1 1 auto;border-radius:2px}.ant-select-single.ant-select-sm .ant-select-selector .ant-select-selection-wrap:after{line-height:22px}.ant-select-single.ant-select-sm .ant-select-selector .ant-select-selection-search{position:absolute;width:100%;inset:0}.ant-select-single.ant-select-sm .ant-select-selector .ant-select-selection-search-input{width:100%;appearance:textfield}.ant-select-single.ant-select-sm .ant-select-selector .ant-select-selection-item{display:block;align-self:center;padding:0;line-height:22px;transition:all .3s,visibility 0s}.ant-select-single.ant-select-sm .ant-select-selector .ant-select-selection-item:after,.ant-select-single.ant-select-sm .ant-select-selector:after{display:inline-block;width:0;visibility:hidden;content:"\a0"}.ant-select-single.ant-select-sm.ant-select-show-arrow .ant-select-selection-item,.ant-select-single.ant-select-sm.ant-select-show-arrow .ant-select-selection-search{padding-inline-end:18px}.ant-select-single.ant-select-sm:not(.ant-select-customize-input) .ant-select-selector{align-items:center;width:100%;height:100%;padding:0 11px}.ant-select-single.ant-select-sm:not(.ant-select-customize-input) .ant-select-selector .ant-select-selection-search-input{height:22px;font-size:14px}.ant-select-single.ant-select-sm:not(.ant-select-customize-input) .ant-select-selector:after{line-height:22px}.ant-select-single.ant-select-sm:not(.ant-select-customize-input) .ant-select-selector{padding:0 7px}.ant-select-single.ant-select-sm:not(.ant-select-customize-input).ant-select-show-arrow .ant-select-selection-search{padding-inline-end:28px}.ant-select-single.ant-select-sm:not(.ant-select-customize-input).ant-select-show-arrow .ant-select-selection-item{padding-inline-end:21px}.ant-select{box-sizing:border-box;margin:0;padding:0;color:#000000d9;font-size:14px;font-variant:tabular-nums;line-height:1.5715;list-style:none;font-feature-settings:"tnum";position:relative;display:inline-flex;cursor:pointer}.ant-select:not(.ant-select-customize-input) .ant-select-selector{position:relative;background-color:#fff;border:1px solid #d9d9d9;border-radius:2px;transition:border-color .3s cubic-bezier(.645,.045,.355,1),box-shadow .3s cubic-bezier(.645,.045,.355,1),background-color .3s cubic-bezier(.645,.045,.355,1)}.ant-select:not(.ant-select-customize-input) .ant-select-selector input{cursor:pointer}.ant-select:not(.ant-select-customize-input) .ant-select-selector .ant-select-selection-wrap{position:relative;display:flex;width:100%;min-width:0}.ant-select:not(.ant-select-customize-input) .ant-select-selector .ant-select-selection-wrap:after{width:0;overflow:hidden;content:"\a0"}.ant-select:not(.ant-select-customize-input) .ant-select-selector .ant-select-selection-search-input{margin:0;padding:0;font-family:inherit;background:0 0;border:none;outline:0;appearance:none}.ant-select:not(.ant-select-customize-input) .ant-select-selector .ant-select-selection-search-input::-webkit-search-cancel-button{display:none;appearance:none}.ant-select:not(.ant-select-disabled):hover .ant-select-selector{border-color:var(--ant-primary-5);border-inline-end-width:1px}.ant-select-selection-item{position:relative;flex:1;overflow:hidden;font-weight:400;white-space:nowrap;text-overflow:ellipsis;-webkit-user-select:none;user-select:none}@media all and (-ms-high-contrast:none){.ant-select-selection-item,.ant-select-selection-item ::-ms-backdrop{flex:auto}}.ant-select-arrow{display:inline-flex;color:inherit;font-style:normal;line-height:0;text-transform:none;vertical-align:-.125em;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;position:absolute;top:50%;inset-inline-start:auto;inset-inline-end:11px;display:flex;align-items:center;height:12px;margin-top:-6px;color:#00000040;font-size:12px;line-height:1;text-align:center;pointer-events:none}.ant-select-arrow>*{line-height:1}.ant-select-arrow svg{display:inline-block}.ant-select-arrow:before{display:none}.ant-select-arrow .anticon{vertical-align:top;transition:transform .3s}.ant-select-arrow .anticon>svg{vertical-align:top}.ant-select-arrow .anticon:not(.ant-select-suffix){pointer-events:auto}.ant-select-arrow>:not(:last-child){margin-inline-end:8px}.ant-select.ant-select-filled .ant-select-selector{background-color:#f5f5f5;border-color:transparent;box-shadow:none}.ant-select.ant-select-filled:hover .ant-select-selector{background-color:#f0f0f0;border-color:transparent;box-shadow:none}.ant-select.ant-select-filled:focus .ant-select-selector{border-color:var(--ant-primary-color-hover);box-shadow:0 0 0 2px var(--ant-primary-color-outline);border-inline-end-width:1px;outline:0;background-color:transparent;box-shadow:none}.ant-space{display:inline-flex}.ant-space-item:empty{display:none}.ant-color-picker-trigger{display:flex;align-items:center;justify-content:center;min-width:32px;height:32px;padding:3px;border:1px solid rgba(0,0,0,.06);border-radius:2px;cursor:pointer;transition:all .2s}.ant-color-picker-trigger:hover{border-color:var(--ant-primary-color)}.ant-color-picker-color-block{position:relative;display:block;width:24px;height:24px;overflow:hidden;background-size:50% 50%;border-radius:2px}.ant-color-picker-color-block-inner{box-sizing:border-box;width:100%;height:100%;border:1px solid rgba(0,0,0,.06)}.ant-color-picker-inline{display:inline-block}.ant-color-picker-inline .ant-color-picker-color-block{width:24px;height:24px;margin:0}
54.ant-color-picker-presets-color{position:relative}.ant-tag{box-sizing:border-box;margin:0;color:#000000d9;font-size:14px;font-variant:tabular-nums;line-height:1.5715;list-style:none;font-feature-settings:"tnum";display:inline-block;height:auto;margin-inline-end:8px;padding:0 7px;font-size:12px;line-height:20px;white-space:nowrap;background:#fafafa;border:1px solid #d9d9d9;border-radius:2px;opacity:1;transition:all .3s}.ant-tag{color:#000000d9}.ant-tag-success{color:var(--ant-success-color);background:var(--ant-success-color-deprecated-bg);border-color:var(--ant-success-color-deprecated-border)}.ant-tag-processing{color:var(--ant-info-color);background:var(--ant-info-color-deprecated-bg);border-color:var(--ant-info-color-deprecated-border)}.ant-tag.ant-tag-borderless{border-color:transparent}.github-btn{height:20px;overflow:hidden;font:700 11px/14px Helvetica Neue,Helvetica,Arial,sans-serif}.gh-btn,.gh-count,.gh-ico{float:left}.gh-btn,.gh-count{padding:2px 5px 2px 4px;color:#333;white-space:nowrap;text-decoration:none;border-radius:3px;cursor:pointer}.gh-btn{background-color:#eee;background-image:linear-gradient(to bottom,#fcfcfc 0,#eee);background-repeat:no-repeat;border:1px solid #d5d5d5}.gh-btn:focus,.gh-btn:hover{text-decoration:none;background-color:#ddd;background-image:-webkit-gradient(linear,left top,left bottom,color-stop(0,#eee),color-stop(100%,#ddd));background-image:linear-gradient(to bottom,#eee 0,#ddd);border-color:#ccc}.gh-btn:active{background-color:#dcdcdc;background-image:none;border-color:#b5b5b5;box-shadow:inset 0 2px 4px #00000026}.gh-ico{width:14px;height:14px;margin-right:4px;background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2ZXJzaW9uPSIxLjEiIGlkPSJMYXllcl8xIiB4PSIwcHgiIHk9IjBweCIgd2lkdGg9IjQwcHgiIGhlaWdodD0iNDBweCIgdmlld0JveD0iMTIgMTIgNDAgNDAiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMTIgMTIgNDAgNDAiIHhtbDpzcGFjZT0icHJlc2VydmUiPjxwYXRoIGZpbGw9IiMzMzMzMzMiIGQ9Ik0zMiAxMy40Yy0xMC41IDAtMTkgOC41LTE5IDE5YzAgOC40IDUuNSAxNS41IDEzIDE4YzEgMC4yIDEuMy0wLjQgMS4zLTAuOWMwLTAuNSAwLTEuNyAwLTMuMiBjLTUuMyAxLjEtNi40LTIuNi02LjQtMi42QzIwIDQxLjYgMTguOCA0MSAxOC44IDQxYy0xLjctMS4yIDAuMS0xLjEgMC4xLTEuMWMxLjkgMC4xIDIuOSAyIDIuOSAyYzEuNyAyLjkgNC41IDIuMSA1LjUgMS42IGMwLjItMS4yIDAuNy0yLjEgMS4yLTIuNmMtNC4yLTAuNS04LjctMi4xLTguNy05LjRjMC0yLjEgMC43LTMuNyAyLTUuMWMtMC4yLTAuNS0wLjgtMi40IDAuMi01YzAgMCAxLjYtMC41IDUuMiAyIGMxLjUtMC40IDMuMS0wLjcgNC44LTAuN2MxLjYgMCAzLjMgMC4yIDQuNyAwLjdjMy42LTIuNCA1LjItMiA1LjItMmMxIDIuNiAwLjQgNC42IDAuMiA1YzEuMiAxLjMgMiAzIDIgNS4xYzAgNy4zLTQuNSA4LjktOC43IDkuNCBjMC43IDAuNiAxLjMgMS43IDEuMyAzLjVjMCAyLjYgMCA0LjYgMCA1LjJjMCAwLjUgMC40IDEuMSAxLjMgMC45YzcuNS0yLjYgMTMtOS43IDEzLTE4LjFDNTEgMjEuOSA0Mi41IDEzLjQgMzIgMTMuNHoiLz48L3N2Zz4=);background-repeat:no-repeat;background-size:100% 100%}.gh-count{position:relative;display:none;margin-inline-start:4px;background-color:#fafafa;border:1px solid #d4d4d4}.gh-count:focus,.gh-count:hover{color:#4183c4}.gh-count:after,.gh-count:before{position:absolute;display:inline-block;width:0;height:0;border-color:transparent;border-style:solid;content:""}.gh-count:before{top:50%;left:-3px;margin-top:-4px;border-width:4px 4px 4px 0;border-right-color:#fafafa}.gh-count:after{top:50%;left:-4px;z-index:-1;margin-top:-5px;border-width:5px 5px 5px 0;border-right-color:#d4d4d4}#header{position:relative;z-index:10;max-width:100%;background:#fff;box-shadow:0 2px 8px #f0f1f2}#header #logo strong{font-weight:500}#header .menu-row{display:flex;align-items:center;margin:0}#header .menu-row>*{flex:none;margin:0 16px 0 0}#header .menu-row>:last-child{margin-inline-end:40px}@media only screen and (max-width:767.99px){#header{text-align:center}}#github-btn{display:flex;flex-flow:nowrap;height:auto}#github-btn .gh-btn{height:auto;padding:1px 4px;background:0 0;border:0}#github-btn .gh-btn .gh-ico{width:20px;height:20px;margin:0}#github-btn .gh-btn .gh-text{display:none}#github-btn .gh-count{min-width:45px;height:auto;padding:4px 8px;font-weight:400;background:#fff}#github-btn .gh-count:hover{color:var(--ant-primary-color)}#logo{height:64px;padding-inline-start:40px;overflow:hidden;color:#000000d9;font-size:18px;font-family:AlibabaSans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji",sans-serif;line-height:64px;white-space:nowrap;text-decoration:none}#logo img{position:relative;top:-1.5px;width:28.27px;height:32px;margin-inline-end:16px}@media only screen and (max-width:767.99px){#logo{padding-inline:0}}#nav{height:100%;font-size:14px;font-family:AlibabaSans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji",sans-serif;border:0}#nav.ant-menu-horizontal{border-bottom:none}#nav.ant-menu-horizontal>.ant-menu-item{min-width:64px;
54height:64px;padding-inline:12px;line-height:64px}#nav.ant-menu-horizontal>.ant-menu-item:after{inset-inline:12px;top:0;bottom:auto;border-width:2px}#nav.ant-menu-horizontal>.ant-menu-item-selected a{color:var(--ant-primary-color)}#nav>.ant-menu-item{text-align:center}#search-box{position:relative;display:flex;flex:auto!important;align-items:center;height:22px;margin-inline-end:auto;padding-inline-start:16px;line-height:22px;white-space:nowrap;border-inline-start:1px solid rgba(0,0,0,.06);transition:width .5s}#search-box>*{flex:auto}#search-box .anticon{position:absolute;top:50%;z-index:1;flex:none;color:#ced4d9;transform:translateY(-50%);pointer-events:none}#search-box input{width:100%;max-width:200px;padding-inline-start:20px;font-size:14px;background:0 0;border:0;box-shadow:none}#search-box input::placeholder{color:#a3b1bf}#language{position:relative;width:1.2em;height:1.2em;transition:all .2s}#language span{position:absolute;color:#000000e0;font-size:1.2em;line-height:1;border:1px solid rgba(0,0,0,.88)}#language span.active{top:-5%;z-index:1;color:#fff;background-color:#000000e0;transform:scale(.7);transform-origin:0 0;inset-inline-start:-5%}#language span:not(.active){inset-inline-end:-5%;bottom:-5%;z-index:0;transform:scale(.5);transform-origin:100% 100%}@media only screen and (max-width:767.99px){#search-box{display:none}}article,blockquote,body,button,code,div,footer,h1,h2,h3,h4,header,input,li,p,pre,section,ul{margin:0;padding:0}ul{list-style:none}@font-face{font-weight:300;font-family:AlibabaSans;font-style:normal;src:url(//mdn.alipayobjects.com/huamei_iwk9zp/afts/file/A*1GSgSYDD_aIAAAAAQsAAAAgAegCCAQ/AlibabaSans-Light.woff2) format("woff2");font-display:swap}@font-face{font-weight:400;font-family:AlibabaSans;font-style:normal;src:url(//mdn.alipayobjects.com/huamei_iwk9zp/afts/file/A*2zEUQqnPNesAAAAAQtAAAAgAegCCAQ/AlibabaSans-Regular.woff2) format("woff2");font-display:swap}@font-face{font-weight:500;font-family:AlibabaSans;font-style:normal;src:url(//mdn.alipayobjects.com/huamei_iwk9zp/afts/file/A*E_cxRbMlZq
54UAAAAAQuAAAAgAegCCAQ/AlibabaSans-Medium.woff2) format("woff2");font-display:swap}@font-face{font-weight:600;font-family:AlibabaSans;font-style:normal;src:url(//mdn.alipayobjects.com/huamei_iwk9zp/afts/file/A*E_cxRbMlZqUAAAAAQuAAAAgAegCCAQ/AlibabaSans-Bold.woff2) format("woff2");font-display:swap}@font-face{font-weight:700;font-family:AlibabaSans;font-style:normal;src:url(//mdn.alipayobjects.com/huamei_iwk9zp/afts/file/A*E_cxRbMlZqUAAAAAQuAAAAgAegCCAQ/AlibabaSans-Heavy.woff2) format("woff2");font-display:swap}body{color:#000000d9;font-size:14px;font-family:AlibabaSans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";background:#fff;transition:background-color 1s cubic-bezier(.075,.82,.165,1)}a{transition:color .3s ease}.main-wrapper{position:relative;padding:40px 0 0;background:#fff}.main-container{position:relative;min-height:500px;padding-bottom:32px;padding-inline-start:64px;padding-inline-end:170px;background:#fff}.main-menu{z-index:1}.main-menu-inner{height:100%;max-height:100vh;overflow:hidden}.main-menu:hover .main-menu-inner{overflow-y:auto}.aside-container{min-height:100%;padding-bottom:48px;font-family:AlibabaSans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji",sans-serif}.aside-container.ant-menu-inline .ant-menu-item a,.aside-container.ant-menu-inline>.ant-menu-item{overflow:hidden;font-size:14px;text-overflow:ellipsis}.aside-container.ant-menu-inline>.ant-menu-item{padding-inline-start:40px!important}.aside-container .menu-title-content-link{display:flex;align-items:center}.aside-container .menu-title-content-link>.ant-tag{position:absolute;inset-inline-end:8px}.page-wrapper{width:100%;padding:0;overflow:hidden}.fixed-widgets{position:fixed;inset-inline-end:32px;bottom:102px;z-index:2147483640;display:flex;flex-direction:column;
54cursor:pointer}.fixed-widgets>div{display:block}.fixed-widgets .fixed-widgets-avatar{width:44px;height:44px;color:#000;font-size:22px;line-height:44px;background-color:#fff;box-shadow:0 3px 6px -4px #0000001f,0 6px 16px #00000014,0 9px 28px 8px #0000000d;transition:color .3s}.fixed-widgets .fixed-widgets-avatar:hover{color:var(--ant-primary-color)}#header,#header #nav.ant-menu,#header #search-box,.main-wrapper,.main-wrapper .main-container{transition:all .3s cubic-bezier(.78,.14,.15,.86)}.rc-footer{position:relative;clear:both;color:#000000a6;font-size:14px;line-height:1.5;box-shadow:inset 0 106px 36px -116px #00000024;background-color:#f0f3fa}.rc-footer a{text-decoration:none;transition:all .3s}.rc-footer a:hover{color:#40a9ff}.rc-footer-container{width:100%;max-width:1200px;margin:auto;padding:80px 48px 20px}.rc-footer-columns{display:flex;justify-content:space-around}.rc-footer-column{margin-bottom:60px}.rc-footer-column h2{position:relative;margin:0 auto 24px;font-weight:500;font-size:16px}.rc-footer-item{margin:12px 0}.rc-footer-item-icon{position:relative;top:-1px;display:inline-block;width:16px;margin-right:.4em;text-align:center;vertical-align:middle}.rc-footer-item-icon>svg{display:block;width:100%}.rc-footer-item-separator{margin:0 .3em}.rc-footer-bottom{box-shadow:inset 0 106px 36px -116px #00000024}.rc-footer-bottom-container{width:100%;max-width:1200px;margin:0 auto;padding:16px 0;font-size:14px;line-height:32px;text-align:center;border-top:1px solid rgba(255,255,255,.25);color:#000000a6}.rc-footer a,.rc-footer h2{color:#000000e0}.rc-footer-bottom-container{border-top-color:#e8e8e8}.rc-footer-item-description,.rc-footer-item-separator{color:#00000073}@media only screen and (max-width:767.99px){.rc-footer{text-align:center}.rc-footer-container{padding:40px 0}.rc-footer-columns{display:block}.rc-footer-column{display:block;margin-bottom:40px}.rc-footer-column:last-child{margin-bottom:0}}.rc-footer{z-index:11}.rc-footer-columns{justify-content:space-between}.prev-next-nav{margin-right:64px;margin-left:64px;overflow:hidden;font-size:14px;border-top:1px solid rgba(0,0,0,.06)}.markdown{color:#000000d9;font-size:14px;line-height:2}.markdown img{max-width:calc(100% - 32px);max-height:100%;object-fit:contain}.markdown h1{margin-bottom:16px;color:#000000d9;font-weight:600;font-size:32px;font-family:AlibabaSans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji",sans-serif;line-height:38px}.markdown h2{font-size:24px;line-height:32px}.markdown h2,.markdown h3,.markdown h4{clear:both;margin:1.6em 0 .6em;color:#000000d9;font-weight:500;font-family:Avenir,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji",sans-serif}.markdown h3{font-size:18px}.markdown h4{font-size:16px}.markdown p,.markdown pre{margin:1em 0}.markdown ul>li{margin-inline-start:20px;padding-inline-start:4px;list-style-type:circle}.markdown ul>li:empty{display:none}.markdown code{margin:0 1px;padding:.2em .4em;font-size:.9em;background:#f2f4f5;border:1px solid rgba(0,0,0,.06);border-radius:3px}.markdown pre{font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,Courier,monospace;background:#f2f4f5;border-radius:2px}.markdown pre code{margin:0;padding:12px 20px;overflow:auto;color:#000000d9;font-size:13px;background:#f5f5f5;border:none}.markdown strong{font-weight:500}.markdown blockquote{margin:1em 0;padding-inline-start:.8em;color:#00000073;font-size:90%;border-inline-start:4px solid rgba(0,0,0,.06)}.markdown blockquote p{margin:0}.markdown .anchor{margin-inline-start:8px;opacity:0;transition:opacity .3s}.markdown h1:hover .anchor,.markdown h2:hover .anchor,.markdown h3:hover .anchor,.markdown h4:hover .anchor{display:inline-block;opacity:1}.toc-affix{position:absolute;top:8px;inset-inline-end:20px}pre code{display:block;padding:16px 32px;color:#000000d9;font-size:14px;font-family:Lucida Console,Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace;line-height:2;white-space:pre;background:#fff;border:1px solid #e9e9e9;border-radius:2px}code[class*=language-]{color:#000;font-family:Lucida Console,Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace;line-height:1.5;direction:ltr;white-space:pre;text-align:left;word-wrap:normal;word-break:normal;word-spacing:normal;tab-size:4;hyphens:none;background:0 0}code[class*=language-]::selection{text-shadow:none;background:#b3d4fc}code[class*=language-] ::selection,code[class*=language-]::selection{text-shadow:none;background:#b3d4fc}@media print{code[class*=language-]{text-shadow:none}}.token.comment{color:#708090}.token.punctuation{color:#999}.token.property,.token.tag{color:#f81d22}.language-css .token.string,.token.attr-name,.token.operator,.token.string{color:#0b8235}.token.atrule,.token.attr-value,.token.keyword{color:#008dff}.token.function{color:#f81d22}.token.variable{color:#e90}@media only screen and (max-width:992px){.main-container{padding-right:48px;padding-left:48px}.main-container .toc-affix{display:none}}@media only screen and (width<=767.99px){.aside-container{float:none;width:auto;padding-bottom:30px;border-right:0}.main-container{margin-right:0;margin-left:0;padding-right:16px;padding-left:16px}.main-wrapper{width:100%;margin:0;border-radius:0}.prev-next-nav{width:calc(100% - 32px);margin-left:16px}}#ng-content{height:100%;transition:transform .3s cubic-bezier(.78,.14,.15,.86)}.toc-affix .ant-anchor{width:128px;font-size:12px}.toc-affix .ant-anchor .ant-anchor-ink:before{width:1px;border-left:1px solid rgba(0,0,0,.06)}.toc-affix .ant-anchor .ant-anchor-link.toc-indent-1{padding-inline-start:16px}.toc-affix .ant-anchor .ant-anchor-link.toc-indent-2{padding-inline-start:32px}.toc-affix .ant-anchor .ant-anchor-link .ant-anchor-link-title{width:110px;color:#000000d9;white-space:nowrap;text-overflow:ellipsis}</style><link rel="stylesheet" href="styles-XEYC5NTU.css" media="print" onload='this.media="all"'><noscript><link rel="stylesheet" href="styles-XEYC5NTU.css"></noscript><style ng-app-id="ng">[_nghost-ng-c4043884323]{position:fixed;top:0;left:0;z-index:999;display:block;width:100%;height:2.5px;background:0 0}[_nghost-ng-c4043884323]:after{display:block;width:40%;height:100%;background:var(--ant-primary-color);transform-origin:left;animation:_ngcontent-ng-c4043884323_nav-progress 1.5s infinite linear;content:""}@keyframes _ngcontent-ng-c4043884323_nav-progress{0%{transform:translate(250%) scaleX(.2)}80%{transform:translate(0) scaleX(1)}to{transform:translate(0) scaleX(0)}}</style><style ng-app-id="ng">::ng-deep .top-menu-additional{position:relative;inset-inline-end:80px;width:190px}</style><link rel="alternate" hreflang="en" href="https://ng.ant.design/docs/getting-started/en"><link rel="alternate" hreflang="x-default" href="https://ng.ant.design/docs/getting-started/en"><link rel="alternate" hreflang="zh" href="https://ng.ant.design/docs/getting-started/zh"></head> 55 <body class="preload"><!--nghm-->
55<script id="ng-event-dispatch-contract">(()=>{function s(e,t,n){for(let i=0;i<t.length;i++){let a=t[i];(n?e.etc:e.et).push(a),e.c.addEventListener(a,e.h,n)}}window.__jsaction_bootstrap=function c(e,t,n,i,a=window){let o=function u(e){let t=[],r=e=>{t.push(e)};return{c:e,q:t,et:[],etc:[],d:r,h:t=>{r(function p(e,t,n,i,a,o,l,_){return{eventType:e,event:t,targetElement:n,eic:i,timeStamp:a,eia:o,eirp:l,eiack:_}}(t.type,t,t.target,e,Date.now()))}}}(e);a._ejsas||(a._ejsas={}),a._ejsas[t]=o,s(o,n),s(o,i,!0)}})()</script>
55<script>window.__jsaction_bootstrap(document.body,"ng",["input","click","keydown","compositionstart","compositionend"],["focus","blur"])</script>
55 56 <app-root ng-version="22.1.0" dir="ltr" ngh="25" ng-server-context="ssg"><app-nav-progress-bar class="nav-progress-bar" _nghost-ng-c4043884323 hidden ngh="0"></app-nav-progress-bar><div id="ng-content"><div class="page-wrapper" dir="ltr"><app-header ngh="9"><header id="header" class="clearfix"><!----><div nz-row class="ant-row" style="flex-flow:nowrap"><div nz-col class="ant-col ant-col-lg-6 ant-col-md-6 ant-col-sm-24 ant-col-xl-5 ant-col-xs-24 ant-col-xxl-4"><a href="/" id="logo"><img width="32" height="28.27" alt="logo" src="./assets/img/logo.svg"><strong>NG-ZORRO</strong></a></div><div nz-col class="menu-row ant-col ant-col-lg-18 ant-col-md-18 ant-col-sm-0 ant-col-xl-19 ant-col-xs-0 ant-col-xxl-20"><div id="search-box" app-searchbar class="focused" ngh="1"><nz-icon role="img" nztype="search" aria-label="search" class="anticon anticon-search"><svg viewBox="64 64 896 896" focusable="false" fill="currentColor" width="1em" height="1em" data-icon="search" aria-hidden="true"><path d="M909.6 854.5L649.9 594.8C690.2 542.7 712 479 712 412c0-80.2-31.3-155.4-87.9-212.1-56.6-56.7-132-87.9-212.1-87.9s-155.5 31.3-212.1 87.9C143.2 256.5 112 331.8 112 412c0 80.1 31.3 155.5 87.9 212.1C256.5 680.8 331.8 712 412 712c67 0 130.6-21.8 182.7-62l259.7 259.6a8.2 8.2 0 0011.6 0l43.6-43.5a8.2 8.2 0 000-11.6zM570.4 570.4C528 612.7 471.8 636 412 636s-116-23.3-158.4-65.6C211.3 528 188 471.8 188 412s23.3-116.1 65.6-158.4C296 211.3 352.2 188 412 188s116.1 23.2 158.4 65.6S636 352.2 636 412s-23.3 116.1-65.6 158.4z"/></svg></nz-icon><input nz-input class="ant-input ant-input-outlined" placeholder="Search in ng.ant.design" jsaction="input:;focus:;blur:;"><!----></div><ul id="nav" nz-menu app-navigation class="menu-site ant-menu ant-menu-root ant-menu-light ant-menu-horizontal" ngh="2"><li nz-menu-item class="ant-menu-item ant-menu-item-selected" ngh="0" jsaction="click:;"><span class="ant-menu-title-content"><a href="/docs/introduce/en" jsaction="click:;"><span>Docs</span></a></span></li><li nz-menu-item class="ant-menu-item" ngh="0" jsaction="click:;"><span class="ant-menu-title-content"><a href="/components/overview/en" jsaction="click:;"><span>Components</span></a></span></li><li nz-menu-item class="ant-menu-item" ngh="0" jsaction="click:;"><span class="ant-menu-title-content"><a href="/experimental/pipes/en" jsaction="click:;"><span>Experimental</span></a></span></li><!----><!----><!----></ul><nz-select nzsize="small" nzvariant="filled" class="ant-select ant-select-sm ant-select-show-arrow ant-select-filled ant-select-single ng-untouched ng-pristine ng-valid" style="max-width:126px;min-width:90px" ngh="7"><nz-select-top-control cdkoverlayorigin class="ant-select-selector" ngh="5" jsaction="keydown:;"><!----><span class="ant-select-selection-wrap"><nz-select-search class="ant-select-selection-search" ngh="3"><input autocomplete="off" class="ant-select-selection-search-input ng-untouched ng-pristine ng-valid" readonly style="opacity:0" value jsaction="input:;blur:;compositionstart:;compositionend:;"><!----></nz-select-search><nz-select-item class="ant-select-selection-item" title="22.1.1" ngh="4"><!----><span class>22.1.1</span><!----><!----><!----><!----></nz-select-item><!----><!----><!----><!----></span></nz-select-top-control><nz-select-arrow class="ant-select-arrow" ngh="6"><!----><!----><!----><nz-icon role="img" nztype="down" aria-label="down" class="anticon anticon-down"><svg viewBox="64 64 896 896" focusable="false" fill="currentColor" width="1em" height="1em" data-icon="down" aria-hidden="true"><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"/></svg></nz-icon><!----><!----><!----><!----><!----><!----></nz-select-arrow><!----><!----><!----></nz-select><button id="language" nz-tooltip nztooltipplacement="bottom" nz-button nzsize="small" nztype="text" class="ant-btn ant-btn-text ant-btn-sm" ngh="8" jsaction="click:;"><!----><span class>ä¸</span><span class="active">En</span></button><!----><button id="direction" nz-tooltip nztooltipplacement="bottom" nz-button nzsize="small" nztype="text" class="ant-btn ltr ant-btn-text ant-btn-sm" ngh="8" jsaction="click:;"><!----><nz-icon role="img" class="anticon"><svg viewBox="0 0 20 20" width="20" height="20" fill="currentColor"><path d="m14.6961816 11.6470802.0841184.0726198 2 2c.2662727.2662727.2904793.682876.0726198.9764816l-.0726198.0841184-2 2c-.2929.2929-.7677.2929-1.0606 0-.2662727-.2662727-.2904793-.682876-.0726198-.9764816l.0726198-.0841184.7196-.7197h-10.6893c-.41421 0-.75-.3358-.75-.75 0-.3796833.28215688-.6934889.64823019-.7431531l.10176981-.0068469h10.6893l-.7196-.7197c-.2929-.2929-.2929-.7677 0-1.0606.2662727-.2662727.682876-.2904793.9764816-.0726198zm-8.1961616-8.6470802c.30667 0 .58246.18671.69635.47146l3.00003 7.50004c.1538.3845-.0333.821-.41784.9749-.38459.1538-.82107-.0333-.9749-.4179l-.81142-2.0285h-2.98445l-.81142 2.0285c-.15383.3846-.59031.5717-.9749.4179-.38458-.1539-.57165-.5904-.41781-.9749l3-7.50004c.1139-.28475.38968-.47146.69636-.47146zm8.1961616 1.14705264.0841184.07261736 2 2c.2662727.26626364.2904793.68293223.0726198.97654222l-.0726198.08411778-2 2c-.2929.29289-.7677.29289-1.0606 0-.2662727-.26626364-.2904793-.68293223-.0726198-.97654222l.0726198-.08411778.7196-.7196675h-3.6893c-.4142 0-.75-.3357925-.75-.7500025 0-.3796925.2821653-.69348832.6482323-.74315087l.1017677-.00684663h3.6893l-.7196-.7196725c-.2929-.29289-.2929-.76777 0-1.06066.2662727-.26626364.682876-.29046942.9764816-.07261736zm-8.1961616 1.62238736-.89223 2.23056h1.78445z"/></svg></nz-icon></button><!----><app-github-btn id="github-btn" class="github-btn" ngh="0"><a tabindex="-1" target="_blank" rel="noopener" aria-hidden="true" class="gh-btn" href="https://github.com/NG-ZORRO/ng-zorro-antd"><span aria-hidden="true" class="gh-ico"></span><span class="gh-text">Star</span></a><a target="_blank" rel="noopener" class="gh-count" style="display:block" href="https://github.com/NG-ZORRO/ng-zorro-antd/stargazers"> 0 </a></app-github-btn><!----><!----><!----><!----></div></div></header><!----></app-header><div class="main-wrapper"><div nz-row class="ant-row"><div nz-col class="main-menu ant-col ant-col-lg-6 ant-col-md-6 ant-col-sm-24 ant-col-xl-5 ant-col-xs-24 ant-col-xxl-4"><nz-affix ngh="0"><div><section class="main-menu-inner"><app-side ngh="11"><ul nz-menu nzmode="inline" class="aside-container ant-menu ant-menu-root ant-menu-light ant-menu-inline" dir="ltr"><li nz-menu-item nzmatchrouter style="padding-inline-start:40px" class="ant-menu-item" ngh="0" jsaction="click:;"><span class="ant-menu-title-content"><a class="menu-title-content-link" href="/docs/introduce/en" jsaction="click:;"><span>Ant Design of Angular</span><!----></a></span></li><li nz-menu-item nzmatchrouter style="padding-inline-start:40px" class="ant-menu-item ant-menu-item-selected" ngh="0" jsaction="click:;"><span class="ant-menu-title-content"><a class="menu-title-content-link" href="/docs/getting-started/en" jsaction="click:;"><span>Getting Started</span><!----></a></span></li><li nz-menu-item nzmatchrouter style="padding-inline-start:40px" class="ant-menu-item" ngh="0" jsaction="click:;"><span class="ant-menu-title-content"><a class="menu-title-content-link" href="/docs/schematics/en" jsaction="click:;"><span>Schematics</span><!----></a></span></li><li nz-menu-item nzmatchrouter style="padding-inline-start:40px" class="ant-menu-item" ngh="0" jsaction="click:;"><span class="ant-menu-title-content"><a class="menu-title-content-link" href="/docs/i18n/en" jsaction="click:;"><span>Internationalization</span><!----></a></span></li><li nz-menu-item nzmatchrouter style="padding-inline-start:40px" class="ant-menu-item" ngh="0" jsaction="click:;"><span class="ant-menu-title-content"><a class="menu-title-content-link" href="/docs/date-adapter/en" jsaction="click:;"><span>Date Adapter</span><nz-tag class="ant-tag ant-tag-success ant-tag-borderless" ngh="10" jsaction="click:;"> New <!----></nz-tag><!----><!----><!----><!----></a></span></li><li nz-menu-item nzmatchrouter style="padding-inline-start:40px" class="ant-menu-item" ngh="0" jsaction="click:;"><span class="ant-menu-title-content"><a class="menu-title-content-link" href="/docs/customize-theme/en" jsaction="click:;"><span>Theme Customization</span><!----></a></span></li><li nz-menu-item nzmatchrouter style="padding-inline-start:40px" class="ant-menu-item" ngh="0" jsaction="click:;"><span class="ant-menu-title-content"><a class="menu-title-content-link" href="/docs/customize-theme-variable/en" jsaction="click:;"><span>Dynamic Theme (Experimental)</span><!----></a></span></li><li nz-menu-item nzmatchrouter style="padding-inline-start:40px" class="ant-menu-item" ngh="0" jsaction="click:;"><span class="ant-menu-title-content"><a class="menu-title-content-link" href="/docs/global-config/en" jsaction="click:;"><span>Global Configuration</span><!----></a></span></li><li nz-menu-item nzmatchrouter style="padding-inline-start:40px" class="ant-menu-item" ngh="0" jsaction="click:;"><span class="ant-menu-title-content"><a class="menu-title-content-link" href="/docs/llms/en" jsaction="click:;"><span>LLMs.txt</span><nz-tag class="ant-tag ant-tag-success ant-tag-borderless" ngh="10" jsaction="click:;"> New <!----></nz-tag><!----><!----><!----><!----></a></span></li><li nz-menu-item nzmatchrouter style="padding-inline-start:40px" class="ant-menu-item" ngh="0" jsaction="click:;"><span class="ant-menu-title-content"><a class="menu-title-content-link" href="/docs/animations/en" jsaction="click:;"><span>Animations Switch</span><nz-tag class="ant-tag ant-tag-processing ant-tag-borderless" ngh="10" jsaction="click:;"> Updated <!----></nz-tag><!----><!----><!----><!----></a></span></li><li nz-menu-item nzmatchrouter style="padding-inline-start:40px" class="ant-menu-item" ngh="0" jsaction="click:;"><span class="ant-menu-title-content"><a class="menu-title-content-link" href="/docs/direction/en" jsaction="click:;"><span>Direction</span><!----></a></span></li><li nz-menu-item nzmatchrouter style="padding-inline-start:40px" class="ant-menu-item" ngh="0" jsaction="click:;"><span class="ant-menu-title-content"><a class="menu-title-content-link" href="/docs/recommendation/en" jsaction="click:;"><span>Resources</span><!----></a></span></li><li nz-menu-item nzmatchrouter style="padding-inline-start:40px" class="ant-menu-item" ngh="0" jsaction="click:;"><span class="ant-menu-title-content"><a class="menu-title-content-link" href="/docs/faq/en" jsaction="click:;"><span>FAQ</span><!----></a></span></li><li nz-menu-item nzmatchrouter style="padding-inline-start:40px" class="ant-menu-item" ngh="0" jsaction="click:;"><span class="ant-menu-title-content"><a class="menu-title-content-link" href="/docs/contributing/en" jsaction="click:;"><span>
56How to Contribute</span><!----></a></span></li><li nz-menu-item nzmatchrouter style="padding-inline-start:40px" class="ant-menu-item" ngh="0" jsaction="click:;"><span class="ant-menu-title-content"><a class="menu-title-content-link" href="/docs/changelog/en" jsaction="click:;"><span>Change Log</span><nz-tag class="ant-tag ant-tag-success ant-tag-borderless" ngh="10" jsaction="click:;"> 22.1.1 <!----></nz-tag><!----><!----><!----><!----></a></span></li><li nz-menu-item nzmatchrouter style="padding-inline-start:40px" class="ant-menu-item" ngh="0" jsaction="click:;"><span class="ant-menu-title-content"><a class="menu-title-content-link" href="/docs/migration-v22/en" jsaction="click:;"><span>v22 Migration Guide</span><!----></a></span></li><!----><!----><!----><!----></ul><!----></app-side><!----></section></div></nz-affix></div><!----><div nz-col class="main-container main-container-component ant-col ant-col-lg-18 ant-col-md-18 ant-col-sm-24 ant-col-xl-19 ant-col-xs-24 ant-col-xxl-20"><router-outlet></router-outlet><nz-doc-getting-started-en ngh="15"><article class="markdown"><h1><nz-space class="ant-space ant-space-horizontal" style="column-gap:8px;row-gap:8px" ngh="12"><!----><!----><div class="ant-space-item"><span>Getting Started</span><!----></div><!----><div class="ant-space-item"><span></span><!----></div><!----><!----></nz-space></h1><nz-affix class="toc-affix" ngh="0"><div><nz-anchor nzshowinkinfixed ngh="13"><!----><div class="ant-anchor-wrapper" style="max-height:100vh"><div class="ant-anchor"><div class="ant-anchor-ink"><div class="ant-anchor-ink-ball"></div></div><nz-link nzhref="#playground" nztitle="Playground" class="ant-anchor-link toc-indent-1" ngh="14"><a class="ant-anchor-link-title" href="#playground" target="undefined" title="Playground" jsaction="click:;"><span>Playground</span><!----><!----></a><!----></nz-link><nz-link nzhref="#first_local_development" nztitle="First Local Development" class="ant-anchor-link toc-indent-1" ngh="14"><a class="ant-anchor-link-title" href="#first_local_development" target="undefined" title="First Local Development" jsaction="click:;"><span>First Local Development</span><!----><!----></a><!----></nz-link><nz-link nzhref="#installation" nztitle="Installation" class="ant-anchor-link toc-indent-2" ngh="14"><a class="ant-anchor-link-title" href="#installation" target="undefined" title="Installation" jsaction="click:;"><span>Installation</span><!----><!----></a><!----></nz-link><nz-link nzhref="#create_a_new_project" nztitle="Create a New Project" class="ant-anchor-link toc-indent-2" ngh="14"><a class="ant-anchor-link-title" href="#create_a_new_project" target="undefined" title="Create a New Project" jsaction="click:;"><span>Create a New Project</span><!----><!----></a><!----></nz-link><nz-link nzhref="#install_ng-zorro-antd" nztitle="Install ng-zorro-antd" class="ant-anchor-link toc-indent-2" ngh="14"><a class="ant-anchor-link-title" href="#install_ng-zorro-antd" target="undefined" title="Install ng-zorro-antd" jsaction="click:;"><span>Install ng-zorro-antd</span><!----><!----></a><!----></nz-link><nz-link nzhref="#development_&_debugging" nztitle="Development & Debugging" class="ant-anchor-link toc-indent-2" ngh="14"><a class="ant-anchor-link-title" href="#development_&_debugging" target="undefined" title="Development & Debugging" jsaction="click:;"><span>Development & Debugging</span><!----><!----></a><!----></nz-link><nz-link nzhref="#building_&_deployment" nztitle="Building & Deployment" class="ant-anchor-link toc-indent-2" ngh="14"><a class="ant-anchor-link-title" href="#building_&_deployment" target="undefined" title="Building & Deployment" jsaction="click:;"><span>Building & Deployment</span><!----><!----></a><!----></nz-link><nz-link nzhref="#customized_build" nztitle="Customized Build" class="ant-anchor-link toc-indent-1" ngh="14"><a class="ant-anchor-link-title" href="#customized_build" target="undefined" title="Customized Build" jsaction="click:;"><span>Customized Build</span><!----><!----></a><!----></nz-link><nz-link nzhref="#install_ng-zorro-antd" nztitle="Install ng-zorro-antd" class="ant-anchor-link toc-indent-2" ngh="14"><a class="ant-anchor-link-title" href="#install_ng-zorro-antd" target="undefined" title="Install ng-zorro-antd" jsaction="click:;"><span>Install ng-zorro-antd</span><!----><!----></a><!----></nz-link><nz-link nzhref="#import_styles" nztitle="Import Styles" class="ant-anchor-link toc-indent-2" ngh="14"><a class="ant-anchor-link-title" href="#import_styles" target="undefined" title="Import Styles" jsaction="click:;"><span>Import Styles</span><!----><!----></a><!----></nz-link><nz-link nzhref="#other" nztitle="Other" class="ant-anchor-link toc-indent-1" ngh="14"><a class="ant-anchor-link-title" href="#other" target="undefined" title="Other" jsaction="click:;"><span>
56Other</span><!----><!----></a><!----></nz-link></div></div><!----><!----><!----></nz-anchor></div></nz-affix><section class="markdown"><p>Ant Design of Angular is dedicated to providing a <strong>good development experience</strong> for programmers.</p><blockquote><p>The prerequisite of Ant Design Angular is a solid background knowledge of <a href="https://angular.dev" target="_blank" rel="noopener">Angular</a> and <a href="http://babeljs.io/docs/learn-es2015/" target="_blank" rel="noopener">JavaScript ES2015</a>.</p></blockquote><h2 id="playground"><span>Playground</span><a onclick='window.location.hash="playground"' class="anchor">#</a></h2><p>The following StackBlitz link demonstrates a basic use case, and it is recommended to fork this demo as a baseline while doing <code>Bug Report</code>. However, please do not use this demo as a scaffold in a real production environment.</p><ul><li><a href="https://stackblitz.com/edit/ng-zorro-antd-ivy" target="_blank" rel="noopener">NG-ZORRO StackBlitz</a></li></ul><h2 id="first_local_development"><span>First Local Development</span><a onclick='window.location.hash="first_local_development"' class="anchor">#</a></h2><p>There are several engineering requirements during development, including compiling, debugging, proxying, and packaging codes in TypeScript. We strongly encourage you to develop your project with the help of Angular official CLI <code>@angular/cli</code>. To be concise, a simple example is demonstrated below.</p><h3 id="installation"><span>Installation</span><a onclick='window.location.hash="installation"' class="anchor">#</a></h3><blockquote><p>Read the documentation of <a href="https://angular.dev/cli" target="_blank" rel="noopener">Angular</a> to explore more features.</p></blockquote><pre><code class="language-bash">$ <span class="token function">npm</span> install -g <span class="token function">@angular/cli</span> 57<span class="token comment"># Or if you use yarn</span> 58$ yarn global add <span class="token function">@angular/cli</span> 59</code></pre><h3 id="create_a_new_project"><span>Create a New Project</span><a onclick='window.location.hash="create_a_new_project"' class="anchor">#</a></h3><p>The following command allows <code>@angular/cli</code> to create a folder called <code>PROJECT-NAME</code> under the current directory, with necessary dependencies.</p><pre><code class="language-bash">$ <span class="token function">ng</span> new PROJECT-NAME 60</code></pre><p><code>@angular/cli</code> will run <code>npm install</code> or <code>yarn</code> after a project is created. You can run <code>npm install</code> or <code>yarn</code> by yourself if it fails.</p><h3 id="install_ng-zorro-antd"><span>Install ng-zorro-antd</span><a onclick='window.location.hash="install_ng-zorro-antd"' class="anchor">#</a></h3><p>After changing the directory to the newly created project, you can automatically run the following commands to initialize the project's configuration, including importing i18n files and stylesheets and loading initial modules.</p><pre><code class="language-bash">$ <span class="token function">cd</span> PROJECT-NAME 61$ <span class="token function">ng</span> add <span class="token function">ng-zorro-antd</span> 62</code></pre><img alt="CLI" src="https://img.alicdn.com/tfs/TB19fFHdkxz61VjSZFtXXaDSVXa-680-243.svg" style="display:block;border-radius:4px;box-shadow:1px 1px 4px 0 rgba(0,0,0,.2)"><p><code>ng-zorro-antd</code> supports initializing configuration with schematics, more information is available in the <a href="/docs/schematics/en">schematics</a> section.</p><h3 id="development_andamp;_debugging"><span>Development & Debugging</span><a onclick='window.location.hash="development_andamp;_debugging"' class="anchor">#</a></h3><p>Your project is now ready to run. After running the following command, a welcome page will be displayed in your browser.</p><pre><code class="language-bash">$ <span class="token function">ng</span> serve --port 0 --open 63</code></pre><img alt="welcome" src="https://img.alicdn.com/tfs/TB1X.qJJgHqK1RjSZFgXXa7JXXa-89-131.svg" style="display:block;padding:30px 30%;height:260px"><h3 id="building_andamp;_deployment"><span>Building & Deployment</span><a onclick='window.location.hash="building_andamp;_deployment"' class="anchor">#</a></h3><pre><code class="language-bash">$ <span class="token function">ng</span> build --prod 64</code></pre><p>Project files are built and generated in the <code>dist</code> directory by default.</p><h2 id="customized_build"><span>Customized Build</span><a onclick='window.location.hash="customized_build"' class="anchor">#</a></h2><p>You may use any existing scaffold tools in the Angular ecosystem in order to customize the building process. Please refer to <a href="https://github.com/NG-ZORRO/ng-zorro-antd/tree/master/integration" target="_blank" rel="noopener">configure</a> section if you encounter any issues.</p><h3 id="install_ng-zorro-antd"><span>Install ng-zorro-antd</span><a onclick='window.location.hash="install_ng-zorro-antd"' class="anchor">#</a></h3><pre><code class="language-bash">$ <span class="token function">npm</span> install <span class="token function">ng-zorro-antd</span> --save 65<span class="token comment"># Or if you use yarn</span> 66$ yarn add <span class="token function">ng-zorro-antd</span> 67</code></pre><h3 id="import_styles"><span>Import Styles</span><a onclick='window.location.hash="import_styles"' class="anchor">#</a></h3><h4 id="use_all_component_styles"><span>Use all component styles</span><a onclick='window.location.hash="use_all_component_styles"' class="anchor">#</a></h4><p>This configuration contains all the styles of our components' library. 68If you want to use only certain components' styles, please refer to <a href="/docs/getting-started/en#use-only-certain-component-styles">Use only certain component styles</a> section.</p><p>Import the pre-built stylesheet in <code>angular.json</code></p><pre><code class="language-json"><span class="token punctuation">{</span> 69 <span class="token property">"styles"</span><span class="token operator">:</span> <span class="token punctuation">[</span><span class="token string">"node_modules/ng-zorro-antd/ng-zorro-antd.min.css"</span><span class="token punctuation">]</span> 70<span class="token punctuation">}</span> 71</code></pre><p>Import the pre-built stylesheet in <code>style.css</code></p><pre><code class="language-css"><span class="token atrule"><span class="token rule">
71@import</span> <span class="token string">'~ng-zorro-antd/ng-zorro-antd.min.css'</span><span class="token punctuation">;</span></span> 72</code></pre><p>Import the less stylesheet in <code>style.less</code></p><pre><code class="language-less"><span class="token variable">@import</span> <span class="token string">'~ng-zorro-antd/ng-zorro-antd.less'</span><span class="token punctuation">;</span> 73</code></pre><h4 id="use_only_certain_component_styles"><span>Use only certain component styles</span><a onclick='window.location.hash="use_only_certain_component_styles"' class="anchor">#</a></h4><blockquote><p>Please note that importing CSS files of several components may result in code redundancy due to the dependency relationships among some components' styles.</p></blockquote><p>It is necessary to import base styles (common to all components) before using certain components' styles.</p><p>Import the pre-build styles in <code>style.css</code></p><pre><code class="language-css"><span class="token atrule"><span class="token rule">@import</span> <span class="token string">'~ng-zorro-antd/style/index.min.css'</span><span class="token punctuation">;</span></span> <span class="token comment">/* Import base styles */</span> 74<span class="token atrule"><span class="token rule">@import</span> <span class="token string">'~ng-zorro-antd/button/style/index.min.css'</span><span class="token punctuation">;</span></span> <span class="token comment">/* Import one component's styles */</span> 75</code></pre><p>Import the less styles in <code>style.less</code></p><pre><code class="language-less"><span class="token variable">@import</span> <span class="token string">'~ng-zorro-antd/style/entry.less'</span><span class="token punctuation">;</span> <span class="token comment">/* Import base styles */</span> 76<span class="token variable">@import</span> <span class="token string">'~ng-zorro-antd/button/style/entry.less'</span><span class="token punctuation">;</span> <span class="token comment">/* Import one component's styles */</span> 77</code></pre><h4 id="import_component_module"><span>Import component module</span><a onclick='window.location.hash="import_component_module"' class="anchor">#</a></h4><p>Finally, you need to import the component modules that you want to use into your components.</p><p>Taking the following <code>NzButtonModule</code> module as an example, first import the component module:</p><pre><code class="language-ts"><span class="token keyword">import</span> <span class="token punctuation">{</span> Component <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">'@angular/core'</span><span class="token punctuation">;</span> 78<span class="token keyword">import</span> <span class="token punctuation">{</span> NzButtonModule <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">'ng-zorro-antd/button'</span><span class="token punctuation">;</span> 79 80<span class="token decorator"><span class="token at operator">@</span><span class="token function">Component</span></span><span class="token punctuation">(</span><span class="token punctuation">{</span> 81 imports<span class="token operator">:</span> <span class="token punctuation">[</span>NzButtonModule<span class="token punctuation">]</span> 82<span class="token punctuation">}</span><span class="token punctuation">)</span> 83<span class="token keyword">export</span> <span class="token keyword">class</span> <span class="token class-name">AppComponent</span> <span class="token punctuation">{</span><span class="token punctuation">}</span> 84</code></pre><p>Then use the component inside the template:</p><pre><code class="language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>button</span> <span class="token attr-name">nz-button</span> <span class="token attr-name">nzType</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>primary<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Primary<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>button</span><span class="token punctuation">></span></span> 85</code></pre><h1 id="precautions"><span>Precautions</span><a onclick='window.location.hash="precautions"' class="anchor">#</a></h1><ul><li><code>ng-zorro-antd</code> already contains <code>@angular/cdk/overlay-prebuilt.css</code> overlay style, no additional import is required.</li></ul><h2 id="other"><span>
85Other</span><a onclick='window.location.hash="other"' class="anchor">#</a></h2><ul><li><a href="/docs/i18n/en">I18n</a></li><li><a href="/docs/customize-theme/en">Customize Theme</a></li><li><a href="/components/icon/en">Use Icons</a></li></ul></section></article></nz-doc-getting-started-en><!----><app-contributors-list ngh="16"><ul nz-flex nzwrap="wrap" nzgap="small" class="ant-flex ant-flex-justify-normal ant-flex-align-normal ant-flex-wrap-wrap" style="margin-top:120px;gap:8px;flex:unset"><!----></ul></app-contributors-list></div></div><div nz-row class="ant-row"><div nz-col class="ant-col ant-col-lg-18 ant-col-lg-offset-6 ant-col-md-24 ant-col-sm-24 ant-col-xl-19 ant-col-xl-offset-5 ant-col-xs-24 ant-col-xxl-20 ant-col-xxl-offset-4"><app-fixed-widgets ngh="17"><div class="fixed-widgets"><div nz-dropdown nzplacement="topCenter" class="ant-dropdown-trigger ant-avatar ant-avatar-circle ant-avatar-icon fixed-widgets-avatar"><theming-icon role="img" class="anticon" ngh="0"><svg width="21" height="21" viewBox="0 0 21 21" fill="currentColor"><g fill-rule="evenodd"><g fill-rule="nonzero"><path d="M7.02 3.635l12.518 12.518a1.863 1.863 0 010 2.635l-1.317 1.318a1.863 1.863 0 01-2.635 0L3.068 7.588A2.795 2.795 0 117.02 3.635zm2.09 14.428a.932.932 0 110 1.864.932.932 0 010-1.864zm-.043-9.747L7.75 9.635l9.154 9.153 1.318-1.317-9.154-9.155zM3.52 12.473c.514 0 .931.417.931.931v.932h.932a.932.932 0 110 1.864h-.932v.931a.932.932 0 01-1.863 0l-.001-.931h-.93a.932.932 0 010-1.864h.93v-.932c0-.514.418-.931.933-.931zm15.374-3.727a1.398 1.398 0 110 2.795 1.398 1.398 0 010-2.795zM4.385 4.953a.932.932 0 000 1.317l2.046 2.047L7.75 7 5.703 4.953a.932.932 0 00-1.318 0zM14.701.36a.932.932 0 01.931.932v.931h.932a.932.932 0 010 1.864h-.933l.001.932a.932.932 0 11-1.863 0l-.001-.932h-.93a.932.932 0 110-1.864h.93v-.931a.932.932 0 01.933-.932z"/></g></g></svg></theming-icon></div><!----><!----></div></app-fixed-widgets><app-nav-bottom ngh="18"><section class="prev-next-nav"><!----><!----></section></app-nav-bottom><app-footer ngh="24"><footer class="rc-footer"><section class="rc-footer-container"><section class="rc-footer-columns"><div app-footer-col class="rc-footer-column" ngh="0"><h2>Resources</h2><app-footer-item title="NG-ZORRO-MOBILE" link="https://ng.mobile.ant.design/" description="Angular" class="rc-footer-item" style="display:block" ngh="19"><a target="_blank" rel="noopener" href="https://ng.mobile.ant.design/"><!----> NG-ZORRO-MOBILE </a><!----><span class="rc-footer-item-separator">-</span><span class="rc-footer-item-description">Angular</span><!----></app-footer-item><app-footer-item title="Ant Design" link="https://ant.design/docs/react/introduce" description="React" class="rc-footer-item" style="display:block" ngh="19"><a target="_blank" rel="noopener" href="https://ant.design/docs/react/introduce"><!----> Ant Design </a><!----><span class="rc-footer-item-separator">-</span><span class="rc-footer-item-description">React</span><!----></app-footer-item><app-footer-item title="Angular" class="rc-footer-item" style="display:block" ngh="20"><a target="_blank" rel="noopener" href="https://angular.dev/"><!----> Angular </a><!----><!----></app-footer-item><app-footer-item title="Angular Aria" class="rc-footer-item" style="display:block" ngh="20"><a target="_blank" rel="noopener" href="https://angular.dev/guide/aria/overview"><!----> Angular Aria </a><!----><!----></app-footer-item><app-footer-item title="Angular CDK" class="rc-footer-item" style="display:block" ngh="20"><a target="_blank" rel="noopener" href="https://material.angular.dev/cdk/categories"><!----> Angular CDK </a><!----><!----></app-footer-item><app-footer-item title="Angular CLI" class="rc-footer-item" style="display:block" ngh="20"><a target="_blank" rel="noopener" href="https://angular.dev/tools/cli"><!----> Angular CLI </a><!----><!----></app-footer-item></div><div app-footer-col class="rc-footer-column" ngh="0"><h2>Community</h2><app-footer-item icon="ant-design" title="Awesome Ant Design" link="https://github.com/websemantics/awesome-ant-design" class="rc-footer-item" style="display:block" ngh="21"><a target="_blank" rel="noopener" href="https://github.com/websemantics/awesome-ant-design"><nz-icon role="img" class="rc-footer-item-icon anticon anticon-ant-design" aria-label="ant-design"><svg viewBox="64 64 896 896" focusable="false" fill="currentColor" width="1em" height="1em" data-icon="ant-design" aria-hidden="true"><path d="M716.3 313.8c19-18.9 19-49.7 0-68.6l-69.9-69.9.1.1c-18.5-18.5-50.3-50.3-95.3-95.2-21.2-2
850.7-55.5-20.5-76.5.5L80.9 474.2a53.84 53.84 0 000 76.4L474.6 944a54.14 54.14 0 0076.5 0l165.1-165c19-18.9 19-49.7 0-68.6a48.7 48.7 0 00-68.7 0l-125 125.2c-5.2 5.2-13.3 5.2-18.5 0L189.5 521.4c-5.2-5.2-5.2-13.3 0-18.5l314.4-314.2c.4-.4.9-.7 1.3-1.1 5.2-4.1 12.4-3.7 17.2 1.1l125.2 125.1c19 19 49.8 19 68.7 0zM408.6 514.4a106.3 106.2 0 10212.6 0 106.3 106.2 0 10-212.6 0zm536.2-38.6L821.9 353.5c-19-18.9-49.8-18.9-68.7.1a48.4 48.4 0 000 68.6l83 82.9c5.2 5.2 5.2 13.3 0 18.5l-81.8 81.7a48.4 48.4 0 000 68.6 48.7 48.7 0 0068.7 0l121.8-121.7a53.93 53.93 0 00-.1-76.4z"/></svg></nz-icon><!----> Awesome Ant Design </a><!----><!----></app-footer-item><app-footer-item icon="global" title="Blog" link="https://ng.ant.design/blog" class="rc-footer-item" style="display:block" ngh="21"><a target="_blank" rel="noopener" href="https://ng.ant.design/blog"><nz-icon role="img" class="rc-footer-item-icon anticon anticon-global" aria-label="global"><svg viewBox="64 64 896 896" focusable="false" fill="currentColor" width="1em" height="1em" data-icon="global" aria-hidden="true"><path d="M854.4 800.9c.2-.3.5-.6.7-.9C920.6 722.1 960 621.7 960 512s-39.4-210.1-104.8-288c-.2-.3-.5-.5-.7-.8-1.1-1.3-2.1-2.5-3.2-3.7-.4-.5-.8-.9-1.2-1.4l-4.1-4.7-.1-.1c-1.5-1.7-3.1-3.4-4.6-5.1l-.1-.1c-3.2-3.4-6.4-6.8-9.7-10.1l-.1-.1-4.8-4.8-.3-.3c-1.5-1.5-3-2.9-4.5-4.3-.5-.5-1-1-1.6-1.5-1-1-2-1.9-3-2.8-.3-.3-.7-.6-1-1C736.4 109.2 629.5 64 512 64s-224.4 45.2-304.3 119.2c-.3.3-.7.6-1 1-1 .9-2 1.9-3 2.9-.5.5-1 1-1.6 1.5-1.5 1.4-3 2.9-4.5 4.3l-.3.3-4.8 4.8-.1.1c-3.3 3.3-6.5 6.7-9.7 10.1l-.1.1c-1.6 1.7-3.1 3.4-4.6 5.1l-.1.1c-1.4 1.5-2.8 3.1-4.1 4.7-.4.5-.8.9-1.2 1.4-1.1 1.2-2.1 2.5-3.2 3.7-.2.3-.5.5-.7.8C103.4 301.9 64 402.3 64 512s39.4 210.1 104.8 288c.2.3.5.6.7.9l3.1 3.7c.4.5.8.9 1.2 1.4l4.1 4.7c0 .1.1.1.1.2 1.5 1.7 3 3.4 4.6 5l.1.1c3.2 3.4 6.4 6.8 9.6 10.1l.1.1c1.6 1.6 3.1 3.2 4.7 4.7l.3.3c3.3 3.3 6.7 6.5 10.1 9.6 80.1 74 187 119.2 304.5 119.2s224.4-45.2 304.3-119.2a300 300 0 0010-9.6l.3-.3c1.6-1.6 3.2-3.1 4.7-4.7l.1-.1c3.3-3.3 6.5-6.7 9.6-10.1l.1-.1c1.5-1.7 3.1-3.3 4.6-5 0-.1.1-.1.1-.2 1.4-1.5 2.8-3.1 4.1-4.7.4-.5.8-.9 1.2-1.4a99 99 0 003.3-3.7zm4.1-142.6c-13.8 32.6-32 62.8-54.2 90.2a444.07 444.07 0 00-81.5-55.9c11.6-46.9 18.8-98.4 20.7-152.6H887c-3 40.9-12.6 80.6-28.5 118.3zM887 484H743.5c-1.9-54.2-9.1-105.7-20.7-152.6 29.3-15.6 56.6-34.4 81.5-55.9A373.86 373.86 0 01887 484zM658.3 165.5c39.7 16.8 75.8 40 107.6 69.2a394.72 394.72 0 01-59.4 41.8c-15.7-45-35.8-84.1-59.2-115.4 3.7 1.4 7.4 2.9 11 4.4zm-90.6 700.6c-9.2 7.2-18.4 12.7-27.7 16.4V697a389.1 389.1 0 01115.7 26.2c-8.3 24.6-17.9 47.3-29 67.8-17.4 32.4-37.8 58.3-59 75.1zm59-633.1c11 20.6 20.7 43.3 29 67.8A389.1 389.1 0 01540 327V141.6c9.2 3.7 18.5 9.1 27.7 16.4 21.2 16.7 41.6 42.6 59 75zM540 640.9V540h147.5c-1.6 44.2-7.1 87.1-16.3 127.8l-.3 1.2A445.02 445.02 0 00540 640.9zm0-156.9V383.1c45.8-2.8 89.8-12.5 130.9-28.1l.3 1.2c9.2 40.7 14.7 83.5 16.3 127.8H540zm-56 56v100.9c-45.8 2.8-89.8 12.5-130.9 28.1l-.3-1.2c-9.2-40.7-14.7-83.5-16.3-127.8H484zm-147.5-56c1.6-44.2 7.1-87.1 16.3-127.8l.3-1.2c41.1 15.6 85 25.3 130.9 28.1V484H336.5zM484 697v185.4c-9.2-3.7-18.5-9.1-27.7-16.4-21.2-16.7-41.7-42.7-59.1-75.1-11-20.6-20.7-43.3-29-67.8 37.2-14.6 75.9-23.3 115.8-26.1zm0-370a389.1 389.1 0 01-115.7-26.2c8.3-24.6 17.9-47.3 29-67.8 17.4-32.4 37.8-58.4 59.1-75.1 9.2-7.2 18.4-12.7 27.7-16.4V327zM365.7 165.5c3.7-1.5 7.3-3 11-4.4-23.4 31.3-43.5 70.4-59.2 115.4-21-12-40.9-26-59.4-41.8 31.8-29.2 67.9-52.4 107.6-69.2zM165.5 365.7c13.8-32.6 32-62.8 54.2-90.2 24.9 21.5 52.2 40.3 81.5 55.9-11.6 46.9-18.8 98.4-20.7 152.6H137c3-40.9 12.6-80.6 28.5-118.3zM137 540h143.5c1.9 54.2 9.1 105.7 20.7 152.6a444.07 444.07 0 00-81.5 55.9A373.86 373.86 0 01137 540zm228.7 318.5c-39.7-16.8-75.8-40-107.6-69.2 18.5-15.8 38.4-29.7 59.4-41.8 15.7 45 35.8 84.1 59.2 115.4-3.7-1.4-7.4-2.9-11-4.4zm292.6 0c-3.7 1.5-7.3 3-11 4.4 23.4-31.3 43.5-70.4 59.2-115.4 21 12 40.9 26 59.4 41.8a373.81 373.81 0 01-107.6 69.2z"/></svg></nz-icon><!----> Blog </a><!----><!----></app-footer-item><app-footer-item icon="x" title="X" link="https://x.com/ng_zorro" class="rc-footer-item" style="display:block" ngh="21"><a target="_blank" rel="noopener" href="https://x.com/ng_zorro"><nz-icon role="img" class="rc-footer-item-icon anticon anticon-x" aria-label="x"><svg fill-rule="evenodd" viewBox="64 64 896 896" focusable="false" fill="currentColor" width="1em" height="1em" data-icon="x" aria-hidden="true"><path d="M921 912L601.11 445.75l.55.43L890.08 112H793.7L558.74 384 372.15 112H119.37l298.65 435.31-.04-.04L103 912h96.39L460.6 609.38 668.2 912zM333.96 184.73l448.83 654.54H706.4L257.2 184.73z"/></svg></nz-icon><!----> X </a><!----><!----></app-footer-item><app-footer-item icon="discord" title="Discord" link="https://discord.gg/Ga6Nd7aqVC" class="rc-footer-item" style="display:block" ngh="21"><a target="_blank" rel="noopener" href="https://discord.gg/Ga6Nd7aqVC"><nz-icon role="img" class="rc-footer-item-icon anticon anticon-discord" aria-label="discord"><svg fill-rule="evenodd" viewBox="64 64 896 896" focusable="false" fill="currentColor" width="1em" height="1em" data-icon="discord" aria-hidden="true"><path d="M405 158l-25 3s-112.13 12.26-194.02 78.02h-.96l-1.02.96c-18.37 16.9-26.37 37.67-39 68.04a982.08 982.08 0 00-38 112C83.27 505.87 64 609.87 64 705v8l4 8c29.63 52 82.24 85.12 131 108 48.74 22.88 90.89 35 120 36l19.02.99 9.98-17 35-62c37.13 8.38 79.88 14 129 14 49.12 0 91.87-5.62 129-14l35 62 10.02 17 18.97-1c29.12-.98 71.27-13.11 120-36 48.77-22.87 101.38-56 131.01-108l4-8v-8c0-95.13-19.26-199.13-43-284.98a982.08 982.08 0 00-38-112c-12.63-30.4-20.63-51.14-39-68l-1-1.03h-1.02C756.16 173.26 644 161.01 644 161.01L619 158l-9.02 23s-9.24 23.37-14.97 50.02a643.04 643.04 0 00-83.01-6.01c-17.12 0-46.72 1.12-83 6.01a359.85 359.85 0 00-1
855.02-50.01zm-44 73.02c1.37 4.48 2.74 8.36 4 12-41.38 10.24-85.51 25.86-126 50.98l34 54.02C356 296.5 475.22 289 512 289c36.74 0 156 7.49 239 59L785 294c-40.49-25.12-84.62-40.74-126-51 1.26-3.62 2.63-7.5 4-12 29.86 6 86.89 19.77 134 57.02-.26.12 12 18.62 23 44.99 11.26 27.13 23.74 63.26 35 104 21.64 78.11 38.63 173.25 40 256.99-20.15 30.75-57.5 58.5-97.02 77.02A311.8 311.8 0 01720 795.98l-16-26.97c9.5-3.52 18.88-7.36 27-11.01 49.26-21.63 76-45 76-45l-42-48s-18 16.52-60 35.02C663.03 718.52 598.87 737 512 737s-151-18.5-193-37c-42-18.49-60-35-60-35l-42 48s26.74 23.36 76 44.99a424.47 424.47 0 0027 11l-16 27.02a311.8 311.8 0 01-78.02-25.03c-39.48-18.5-76.86-46.24-96.96-76.99 1.35-83.74 18.34-178.88 40-257A917.22 917.22 0 01204 333c11-26.36 23.26-44.86 23-44.98 47.11-37.25 104.14-51.01 134-57m39 217.99c-24.74 0-46.62 14.11-60 32-13.38 17.89-20 39.87-20 64s6.62 46.11 20 64c13.38 17.89 35.26 32 60 32 24.74 0 46.62-14.11 60-32 13.38-17.89 20-39.87 20-64s-6.62-46.11-20-64c-13.38-17.89-35.26-32-60-32m224 0c-24.74 0-46.62 14.11-60 32-13.38 17.89-20 39.87-20 64s6.62 46.11 20 64c13.38 17.89 35.26 32 60 32 24.74 0 46.62-14.11 60-32 13.38-17.89 20-39.87 20-64s-6.62-46.11-20-64c-13.38-17.89-35.26-32-60-32m-224 64c1.76 0 4 .64 8 6.01 4 5.35 8 14.72 8 25.99 0 11.26-4 20.64-8 26.01-4 5.35-6.24 5.99-8 5.99-1.76 0-4-.64-8-6.02a44.83 44.83 0 01-8-25.98c0-11.27 4-20.64 8-26.02 4-5.34 6.24-5.98 8-5.98m224 0c1.76 0 4 .64 8 6.01 4 5.35 8 14.72 8 25.99 0 11.26-4 20.64-8 26.01-4 5.35-6.24 5.99-8 5.99-1.76 0-4-.64-8-6.02a44.83 44.83 0 01-8-25.98c0-11.27 4-20.64 8-26.02 4-5.34 6.24-5.98 8-5.98"/></svg></nz-icon><!----> Discord </a><!----><!----></app-footer-item><!----><app-footer-item icon="medium" title="Medium" link="https://medium.com/ng-zorro" class="rc-footer-item" style="display:block" ngh="21"><a target="_blank" rel="noopener" href="https://medium.com/ng-zorro"><nz-icon role="img" class="rc-footer-item-icon anticon anticon-medium" aria-label="medium"><svg viewBox="64 64 896 896" focusable="false" fill="currentColor" width="1em" height="1em" data-icon="medium" aria-hidden="true"><path d="M834.7 279.8l61.3-58.9V208H683.7L532.4 586.4 360.3 208H137.7v12.9l71.6 86.6c7 6.4 10.6 15.8 9.7 25.2V673c2.2 12.3-1.7 24.8-10.3 33.7L128 805v12.7h228.6v-12.9l-80.6-98a39.99 39.99 0 01-11.1-33.7V378.7l200.7 439.2h23.3l172.6-439.2v349.9c0 9.2 0 11.1-6 17.2l-62.1 60.3V819h301.2v-12.9l-59.9-58.9c-5.2-4-7.9-10.7-6.8-17.2V297a18.1 18.1 0 016.8-17.2z"/></svg></nz-icon><!----> Medium </a><!----><!----></app-footer-item></div><div app-footer-col class="rc-footer-column" ngh="0"><h2>Help</h2><app-footer-item icon="github" title="GitHub" link="https://github.com/NG-ZORRO/ng-zorro-antd" class="rc-footer-item" style="display:block" ngh="21"><a target="_blank" rel="noopener" href="https://github.com/NG-ZORRO/ng-zorro-antd"><nz-icon role="img" class="rc-footer-item-icon anticon anticon-github" aria-label="github"><svg viewBox="64 64 896 896" focusable="false" fill="currentColor" width="1em" height="1em" data-icon="github" aria-hidden="true"><path d="M511.6 76.3C264.3 76.2 64 276.4 64 523.5 64 718.9 189.3 885 363.8 946c23.5 5.9 19.9-10.8 19.9-22.2v-77.5c-135.7 15.9-141.2-73.9-150.3-88.9C215 726 171.5 718 184.5 703c30.9-15.9 62.4 4 98.9 57.9 26.4 39.1 77.9 32.5 104 26 5.7-23.5 17.9-44.5 34.7-60.8-140.6-25.2-199.2-111-199.2-213 0-49.5 16.3-95 48.3-131.7-20.4-60.5 1.9-112.3 4.9-120 58.1-5.2 118.5 41.6 123.2 45.3 33-8.9 70.7-13.6 112.9-13.6 42.4 0 80.2 4.9 113.5 13.9 11.3-8.6 67.3-48.8 121.3-43.9 2.9 7.7 24.7 58.3 5.5 118 32.4 36.8 48.9 82.7 48.9 132.3 0 102.2-59 188.1-200 212.9a127.5 127.5 0 0138.1 91v112.5c.8 9 0 17.9 15 17.9 177.1-59.7 304.6-227 304.6-424.1 0-247.2-200.4-447.3-447.5-447.3z"/></svg></nz-icon><!----> GitHub </a><!----><!----></app-footer-item><app-footer-item icon="history" class="rc-footer-item" style="display:block" ngh="21"><a target="_blank" rel="noopener" href="https://ng.ant.design/docs/changelog/en"><nz-icon role="img" class="rc-footer-item-icon anticon anticon-history" aria-label="history"><svg viewBox="64 64 896 896" focusable="false" fill="currentColor" width="1em" height="1em" data-icon="history" aria-hidden="true"><path d="M536.1 273H488c-4.4 0-8 3.6-8 8v275.3c0 2.6 1.2 5 3.3 6.5l165.3 120.7c3.6 2.6 8.6 1.9 11.2-1.7l28.6-39c2.7-3.7 1.9-8.7-1.7-11.2L544.1 528.5V281c0-4.4-3.6-8-8-8zm219.8 75.2l
85156.8 38.3c5 1.2 9.9-2.6 9.9-7.7l.8-161.5c0-6.7-7.7-10.5-12.9-6.3L752.9 334.1a8 8 0 003 14.1zm167.7 301.1l-56.7-19.5a8 8 0 00-10.1 4.8c-1.9 5.1-3.9 10.1-6 15.1-17.8 42.1-43.3 80-75.9 112.5a353 353 0 01-112.5 75.9 352.18 352.18 0 01-137.7 27.8c-47.8 0-94.1-9.3-137.7-27.8a353 353 0 01-112.5-75.9c-32.5-32.5-58-70.4-75.9-112.5A353.44 353.44 0 01171 512c0-47.8 9.3-94.2 27.8-137.8 17.8-42.1 43.3-80 75.9-112.5a353 353 0 01112.5-75.9C430.6 167.3 477 158 524.8 158s94.1 9.3 137.7 27.8A353 353 0 01775 261.7c10.2 10.3 19.8 21 28.6 32.3l59.8-46.8C784.7 146.6 662.2 81.9 524.6 82 285 82.1 92.6 276.7 95 516.4 97.4 751.9 288.9 942 524.8 942c185.5 0 343.5-117.6 403.7-282.3 1.5-4.2-.7-8.9-4.9-10.4z"/></svg></nz-icon><!----> Changelog </a><!----><!----></app-footer-item><app-footer-item icon="profile" class="rc-footer-item" style="display:block" ngh="21"><a target="_blank" rel="noopener" href="https://ng.ant.design/docs/faq/en"><nz-icon role="img" class="rc-footer-item-icon anticon anticon-profile" aria-label="profile"><svg viewBox="64 64 896 896" focusable="false" fill="currentColor" width="1em" height="1em" data-icon="profile" aria-hidden="true"><path d="M880 112H144c-17.7 0-32 14.3-32 32v736c0 17.7 14.3 32 32 32h736c17.7 0 32-14.3 32-32V144c0-17.7-14.3-32-32-32zm-40 728H184V184h656v656zM492 400h184c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8H492c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8zm0 144h184c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8H492c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8zm0 144h184c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8H492c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8zM340 368a40 40 0 1080 0 40 40 0 10-80 0zm0 144a40 40 0 1080 0 40 40 0 10-80 0zm0 144a40 40 0 1080 0 40 40 0 10-80 0z"/></svg></nz-icon><!----> FAQ </a><!----><!----></app-footer-item><app-footer-item icon="bug" class="rc-footer-item" style="display:block" ngh="21"><a target="_blank" rel="noopener" href="https://ng.ant.design/issue-helper/#/en"><nz-icon role="img" class="rc-footer-item-icon anticon anticon-bug" aria-label="bug"><svg viewBox="64 64 896 896" focusable="false" fill="currentColor" width="1em" height="1em" data-icon="bug" aria-hidden="true"><path d="M304 280h56c4.4 0 8-3.6 8-8 0-28.3 5.9-53.2 17.1-73.5 10.6-19.4 26-34.8 45.4-45.4C450.9 142 475.7 136 504 136h16c28.3 0 53.2 5.9 73.5 17.1 19.4 10.6 34.8 26 45.4 45.4C650 218.9 656 243.7 656 272c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8 0-40-8.8-76.7-25.9-108.1a184.31 184.31 0 00-74-74C596.7 72.8 560 64 520 64h-16c-40 0-76.7 8.8-108.1 25.9a184.31 184.31 0 00-74 74C304.8 195.3 296 232 296 272c0 4.4 3.6 8 8 8z"/><path d="M940 512H792V412c76.8 0 139-62.2 139-139 0-4.4-3.6-8-8-8h-60c-4.4 0-8 3.6-8 8a63 63 0 01-63 63H232a63 63 0 01-63-63c0-4.4-3.6-8-8-8h-60c-4.4 0-8 3.6-8 8 0 76.8 62.2 139 139 139v100H84c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h148v96c0 6.5.2 13 .7 19.3C164.1 728.6 116 796.7 116 876c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8 0-44.2 23.9-82.9 59.6-103.7a273 273 0 0022.7 49c24.3 41.5 59 76.2 100.5 100.5S460.5 960 512 960s99.8-13.9 141.3-38.2a281.38 281.38 0 00123.2-149.5A120 120 0 01836 876c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8 0-79.3-48.1-147.4-116.7-176.7.4-6.4.7-12.8.7-19.3v-96h148c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8zM716 680c0 36.8-9.7 72-27.8 102.9-17.7 30.3-43 55.6-73.3 73.3C584 874.3 548.8 884 512 884s-72-9.7-102.9-27.8c-30.3-17.7-55.6-43-73.3-73.3A202.75 202.75 0 01308 680V412h408v268z"/></svg></nz-icon><!----> Bug Report </a><!----><!----></app-footer-item><app-footer-item icon="issues-close" link="https://github.com/NG-ZORRO/ng-zorro-antd/discussions" class="rc-footer-item" style="display:block" ngh="21"><a target="_blank" rel="noopener" href="https://github.com/NG-ZORRO/ng-zorro-antd/discussions"><nz-icon role="img" class="rc-footer-item-icon anticon anticon-issues-close" aria-label="issues-close"><svg viewBox="64 64 896 896" focusable="false" fill="currentColor" width="1em" height="1em" data-icon="issues-close" aria-hidden="true"><path d="M464 688a48 48 0 1096 0 48 48 0 10-96 0zm72-112c4.4 0 8-3.6 8-8V296c0-4.4-3.6-8-8-8h-48c-4.4 0-8 3.6-8 8v272c0 4.4 3.6 8 8 8h48zm400-188h-59.3c-2.6 0-5 1.2-6.5 3.3L763.7 538.1l-49.9-68.8a7.92 7.92 0 00-6.5-3.3H648c-6.5 0-10.3 7.4-6.5 12.7l109.2 150.7a16.1 16.1 0 0026 0l165.8-228.7c3.8-5.3 0-12.7-6.5-12.7zm-44 306h-64.2c-5.5 0-10.6 2.9-13.6 7.5a352.2 352.2 0 01-49.8 62.2A355.92 355.92 0 01651.1 840a355 355 0 01-138.7 27.9c-48.1 0-94.8-9.4-138.7-27.9a355.92 355.92 0 01-113.3-76.3A353.06 353.06 0 01184 650.5c-18.6-43.8-28-90.5-28-138.5s9.4-94.7 28-138.5c17.9-42.4 43.6-80.5 76.4-113.2 32.8-32.7 70.9-58.4 113.3-76.3a355 355 0 01138.7-27.9c48.1 0 94.8 9.4 138.7 27.9 42.4 17.9 80.5 43.6 113.3 76.3 19 19 35.6 39.8 49.8 62.2 2.9 4.7 8.1 7.5 13.6 7.5H892c6 0 9.8-6.3 7.2-11.6C828.8 178.5 684.7 82 517.7 80 278.9 7
857.2 80.5 272.5 80 511.2 79.5 750.1 273.3 944 512.4 944c169.2 0 315.6-97 386.7-238.4A8 8 0 00892 694z"/></svg></nz-icon><!----> Discussions </a><!----><!----></app-footer-item><app-footer-item icon="book" link="https://github.com/NG-ZORRO/today-ng-steps" class="rc-footer-item" style="display:block" ngh="21"><a target="_blank" rel="noopener" href="https://github.com/NG-ZORRO/today-ng-steps"><nz-icon role="img" class="rc-footer-item-icon anticon anticon-book" aria-label="book"><svg viewBox="64 64 896 896" focusable="false" fill="currentColor" width="1em" height="1em" data-icon="book" aria-hidden="true"><path d="M832 64H192c-17.7 0-32 14.3-32 32v832c0 17.7 14.3 32 32 32h640c17.7 0 32-14.3 32-32V96c0-17.7-14.3-32-32-32zm-260 72h96v209.9L621.5 312 572 347.4V136zm220 752H232V136h280v296.9c0 3.3 1 6.6 3 9.3a15.9 15.9 0 0022.3 3.7l83.8-59.9 81.4 59.4c2.7 2 6 3.1 9.4 3.1 8.8 0 16-7.2 16-16V136h64v752z"/></svg></nz-icon><!----> Tutorials </a><!----><!----></app-footer-item><app-footer-item icon="question-circle" title="StackOverflow" link="https://stackoverflow.com/questions/tagged/ng-zorro-antd" class="rc-footer-item" style="display:block" ngh="21"><a target="_blank" rel="noopener" href="https://stackoverflow.com/questions/tagged/ng-zorro-antd"><nz-icon role="img" class="rc-footer-item-icon anticon anticon-question-circle" aria-label="question-circle"><svg viewBox="64 64 896 896" focusable="false" fill="currentColor" width="1em" height="1em" data-icon="question-circle" aria-hidden="true"><path d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"/><path d="M623.6 316.7C593.6 290.4 554 276 512 276s-81.6 14.5-111.6 40.7C369.2 344 352 380.7 352 420v7.6c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V420c0-44.1 43.1-80 96-80s96 35.9 96 80c0 31.1-22 59.6-56.1 72.7-21.2 8.1-39.2 22.3-52.1 40.9-13.1 19-19.9 41.8-19.9 64.9V620c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8v-22.7a48.3 48.3 0 0130.9-44.8c59-22.7 97.1-74.7 97.1-132.5.1-39.3-17.1-76-48.3-103.3zM472 732a40 40 0 1080 0 40 40 0 10-80 0z"/></svg></nz-icon><!----> StackOverflow </a><!----><!----></app-footer-item><app-footer-item class="rc-footer-item" style="display:block" ngh="22"><!----><!----><nz-color-picker class="ant-color-picker-inline" ngh="23"><div nz-popover class="ant-color-picker-trigger"><nz-color-block class="ant-color-picker-inline" ngh="0"><ng-antd-color-block class="ant-color-picker-color-block ant-color-picker-presets-color" ngh="0" jsaction="click:;"><div class="ant-color-picker-color-block-inner" style="background-color:#1890ff"></div></ng-antd-color-block></nz-color-block><!----><!----><!----></div><!----><!----><!----><!----></nz-color-picker></app-footer-item></div></section></section><section class="rc-footer-bottom"><div class="rc-footer-bottom-container"> Made with <span style="color:#fff">â¤</span> by NG-ZORRO team </div></section></footer></app-footer></div></div></div></div></div><!----><!----></app-root> 86 <!-- Global site tag (gtag.js) - Google Analytics -->
vendor: 68 bytes, lines 86-87
86 87 <script async src="https://www.googletagmanager.com/gtag/js?id=
87UA-52892298-2
vendor: 16 bytes, lines 87-88
87"></script> 88
88<script>function gtag(){dataLayer.push(arguments)}window.dataLayer=window.dataLayer||[],gtag("js",new Date),gtag("config","UA-52892298-2")</script>
88 89 <noscript>Please enable JavaScript to continue using this application.</noscript> 90
90<script src="main-QWOX3Q2F.js" type="module"></script>
90 91
92<script id="ng-state" type="application/json">{"__nghData__":[{},{"c":{"1":[]}},{"n":{"1":"0f2","5":"4f2","9":"8f2"},"t":{"12":"t4","13":"t5","14":"t6"},"c":{"12":[],"13":[],"14":[]}},{"t":{"2":"t10"},"c":{"2":[]}},{"t":{"0":"t12","1":"t15"},"c":{"0":[{"i":"t12","r":4,"e":{"0":3},"t":{"1":"t13","2":"t14"},"c":{"1":[],"2":[{"i":"t14","r":1}]}}],"1":[]}},{"t":{"0":"t8","2":"t9","3":"t16","4":"t17"},"c":{"0":[],"2":[{"i":"t9","r":3,"t":{"1":"t11"},"c":{"1":[{"i":"t11","r":1}]}}],"3":[],"4":[]}},{"t":{"0":"t19","1":"t20","2":"t21","3":"t26"},"c":{"0":[],"1":[],"2":[{"i":"t21","r":5,"t":{"0":"t22","1":"t25"},"c":{"0":[{"i":"t22","r":3,"t":{"0":"t23","1":"t24"},"c":{"0":[],"1":[{"i":"t24","r":1}]}}],"1":[]}}],"3":[{"i":"t27","r":1,"t":{"0":"t28"},"c":{"0":[]}}]}},{"t":{"2":"t18","3":"t29","4":"t30"},"c":{"2":[{"i":"t18","r":1,"t":{"1":"t27"},"d":[1]}],"3":[],"4":[]}},{"t":{"0":"t31"},"c":{"0":[]}},{"t":{"1":"t0","10":"t1","11":"t2"},"c":{"1":[],"10":[{"i":"t1","r":10,"c":{"0":[{"i":"t2","r":9,"t":{"0":"t3"},"c":{"0":[{"i":"t3","r":8,"t":{"1":"t7"},"c":{"1":[{"i":"t7","r":6,"n":{"2":"1fn","8":"6fn"},"c":{"1":[],"6":[]}}]}}]}}]}}],"11":[]}},{"n":{"1":"hfn"},"t":{"1":"t40"},"c":{"1":[]}},{"t":{"1":"t35","2":"t36","3":"t43","4":"t38"},"c":{"1":[{"i":"t35","r":17,"t":{"1":"t1553"},"c":{"1":[{"i":"t1553","r":1,"n":{"1":"0f2"},"t":{"4":"t1554"},"c":{"4":[]},"x":4},{"i":"t1553","r":1,"n":{"1":"0f2"},"t":{"4":"t1554"},"c":{"4":[{"i":"t1554","r":4,"t":{"0":"t1555"},"c":{"0":[{"i":"t38","r":3,"n":{"1":"hf2n4f3n"},"t":{"1":"t39","2":"t41"},"c":{"1":[{"i":"t39","r":1,"n":{"1":"0f"}}],"2":[]}}]}}]}},{"i":"t1553","r":1,"n":{"1":"0f2"},"t":{"4":"t1554"},"c":{"4":[]},"x":3},{"i":"t1553","r":1,"n":{"1":"0f2"},"t":{"4":"t1554"},"c":{"4":[{"i":"t1554","r":4,"t":{"0":"t1555"},"c":{"0":[{"i":"t38","r":3,"n":{"1":"hf2n8f3n"},"t":{"1":"t39","2":"t41"},"c":{"1":[{"i":"t39","r":1,"n":{"1":"0f"}}],"2":[]}}]}}]}},{"i":"t1553","r":1,"n":{"1":"0f2"},"t":{"4":"t1554"},"c":{"4":[{"i":"t1554","r":4,"t":{"0":"t1555"},"c":{"0":[{"i":"t38","r":3,"n":{"1":"hf2n9f3n"},"t":{"1":"t39","2":"t41"},"c":{"1":[{"i":"t39","r":1,"n":{"1":"0f"}}],"2":[]}}]}}]}},{"i":"t1553","r":1,"n":{"1":"0f2"},"t":{"4":"t1554"},"c":{"4":[]},"x":4},{"i":"t1553","r":1,"n":{"1":"0f2"},"t":{"4":"t1554"},"c":{"4":[{"i":"t1554","r":4,"t":{"0":"t1555"},"c":{"0":[{"i":"t38","r":3,"n":{"1":"hf2n14f3n"},"t":{"1":"t39","2":"t41"},"c":{"1":[{"i":"t39","r":1,"n":{"1":"0f"}}],"2":[]}}]}}]}},{"i":"t1553","r":1,"n":{"1":"0f2"},"t":{"4":"t1554"},"c":{"4":[]}}]}}],"2":[],"3":[],"4":[]}},{"n":{"2":"hfn2"},"t":{"2":"t71"},"c":{"2":[{"i":"t71","r":2,"c":{"1":[{"i":"t1570","r":1}],"2":[]},"t":{"2":"t73"}},{"i":"t71","r":2,"c":{"1":[{"i":"t1571","r":1}],"2":[]},"t":{"2":"t73"}}]}},{"t":{"0":"t64","1":"t65","2":"t67"},"c":{"0":[],"1":[{"i":"t65","r":2,"t":{"0":"t66"},"c":{"0":[{"i":"t67","r":1}]}}],"2":[]}},{"t":{"2":"t68","3":"t69","4":"t70"},"c":{"2":[{"i":"t68","r":1}],"3":[],"4":[{"i":"t70","r":0}]}},{"n":{"3":"2f","6":"5f2","7":"6fnf2n"},"t":{"3":"t1570","4":"t1571"},"c":{"3":[],"4":[]}},{"t":{"2":"t44"},"c":{"2":[]}},{"c":{"1":[]},"d":[3,5,7],"t":{"7":"t45"}},{"t":{"1":"t46","2":"t47"},"c":{"1":[],"2":[]}},{"t":{"0":"t48","1":"t50"},"c":{"0":[{"i":"t48","r":1,"t":{"1":"t49"},"c":{"1":[]}}],"1":[{"i":"t50","r":2}]}},{"t":{"0":"t48","1":"t50"},"c":{"0":[{"i":"t48","r":1,"t":{"1":"t49"},"c":{"1":[]}}],"1":[]}},{"t":{"0":"t48","1":"t50"},"c":{"0":[{"i":"t48","r":1,"t":{"1":"t49"},"c":{"1":[{"i":"t49","r":1}]}}],"1":[]}},{"t":{"0":"t48","1":"t50"},"c":{"0":[],"1":[]}},{"c":{"0":[],"1":[{"i":"t52","r":1}],"2":[],"3":[],"4":[],"6":[],"8":[]},"t":{"1":"t52","2":"t53","3":"t54","4":"t55","6":"t56","8":"t57"}},{"n":{"4":"3fn","11":"10fn","18":"17fn","26":"25fn2"},"t":{"15":"t51"},"c":{"15":[]}},{"t":{"6":"t32","15":"t58","16":"t34"},"c":{"6":[{"i":"t32","r":1,"n":{"2":"1f2"},"t":{"3":"t33"},"c":{"3":[{"i":"t34","r":1}]}}],"8":[{"i":"c207393779","r":1}],"15":[],"16":[]}}]}</script>
92</body></html>
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.