https://preview-8494-ng-zorro-antd.surge.sh/2340.3aba062c84c03658.js

1"use strict";(self.webpackChunkng_zorro_antd_doc=self.webpackChunkng_zorro_antd_doc||[]).push([[2340],{2340:(x,g,i)=>{i.r(g),i.d(g,{NzDemoImageModule:()=>N});var v=i(9072),w=i(2928),r=i(6956),c=i(8352),C=i(1160),z=i(3164);const b=[r.c1,c.EV,C.I$,z.uw];var l=i(6056),e=i(4496),E=i(8700),k=i(8656),s=i(3172),p=i(9100),R=i(5120),m=i(28);let h=(()=>{class n{static#e=this.\u0275fac=function(t){return new(t||n)};static#n=this.\u0275cmp=e.In1({type:n,selectors:[["nz-demo-image-basic"]],decls:1,vars:0,consts:[["nz-image","","width","200px","height","200px","nzSrc","https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png","alt",""]],template:function(t,a){1&t&&e.wR5(0,"img",0)},dependencies:[r.Ok],encapsulation:2})}return n})();var O=i(6504),I=i(7324);let Y=(()=>{class n{constructor(o){this.nzImageService=o,this.scaleStep=.5}onClick(){this.nzImageService.preview([{src:"https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png",alt:""}],{nzZoom:1,nzRotate:0,nzScaleStep:this.scaleStep})}static#e=this.\u0275fac=function(t){return new(t||n)(e.GI1(r.S8))};static#n=this.\u0275cmp=e.In1({type:n,selectors:[["nz-demo-image-controlled-preview"]],decls:7,vars:3,consts:[[3,"ngModel","nzMin","nzStep","ngModelChange"],["nz-button","","nzType","primary",3,"click"]],template:function(t,a){1&t&&(e.I0R(0,"div")(1,"label")(2,"span"),e.OEk(3,"scale step:"),e.C$Y(),e.I0R(4,"nz-input-number",0),e.iHE("ngModelChange",function(u){return e.kNx(a.scaleStep,u)||(a.scaleStep=u),u}),e.C$Y()(),e.I0R(5,"button",1),e.qCj("click",function(){return a.onClick()}),e.OEk(6,"Preview"),e.C$Y()()),2&t&&(e.yG2(4),e.OKB("ngModel",a.scaleStep),e.E7m("nzMin",.1)("nzStep",1))},dependencies:[O.ue,O._G,c.Ez,m.k,I.o9,z.mG],styles:["div[_ngcontent-%COMP%]{display:flex;flex-direction:column;align-items:flex-start;gap:1rem}label[_ngcontent-%COMP%]{display:flex;align-items:center;gap:.5rem}"]})}return n})(),$=(()=>{class n{constructor(){this.fallback="data:image/png;base64,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"}static#e=this.\u0275fac=function(t){return new(t||n)};static#n=this.\u0275cmp=e.In1({type:n,selectors:[["nz-demo-image-fallback"]],decls:1,vars:1,consts:[["nz-image","","width","200px","height","200px","nzSrc","error","alt","",3,"nzFallback"]],template:function(t,a){1&t&&e.wR5(0,"img",0),2&t&&e.E7m("nzFallback",a.fallback)},dependencies:[r.Ok],encapsulation:2})}return n})();function B(n,Q){if(1&n&&e.wR5(0,"img",3),2&n){const o=e.GaO();e.E7m("nzSrc",o.src)("nzPlaceholder",o.placeholder)}}function D(n,Q){if(1&n){const o=e.KQA();e.I0R(0,"button",4),e.qCj("click",function(){e.usT(o);const a=e.GaO();return e.CGJ(a.onReload())}),e.OEk(1,"Reload"),e.C$Y()}}let A=(()=>{class n{constructor(){this.src="https://zos.alipayobjects.com/rmsportal/jkjg

1kEfvpUPVyRjUImniVslZfWPnJuuZ.png",this.placeholder="https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png?x-oss-process=image/blur,r_50,s_50/quality,q_1/resize,m_mfit,h_200,w_200"}onReload(){this.src=`https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png?${new Date}`}static#e=this.\u0275fac=function(t){return new(t||n)};static#n=this.\u0275cmp=e.In1({type:n,selectors:[["nz-demo-image-placeholder"]],decls:3,vars:1,consts:[[3,"nzSize"],["nz-image","","width","200px","height","200px",3,"nzSrc","nzPlaceholder",4,"nzSpaceItem"],["nz-button","","nzType","primary",3,"click",4,"nzSpaceItem"],["nz-image","","width","200px","height","200px",3,"nzSrc","nzPlaceholder"],["nz-button","","nzType","primary",3,"click"]],template:function(t,a){1&t&&(e.I0R(0,"nz-space",0),e.yuY(1,B,1,2,"img",1)(2,D,2,0,"button",2),e.C$Y()),2&t&&e.E7m("nzSize",12)},dependencies:[r.Ok,c.Ez,m.k,I.o9,C.Ud,C.UH],encapsulation:2})}return n})(),f=(()=>{class n{static#e=this.\u0275fac=function(t){return new(t||n)};static#n=this.\u0275cmp=e.In1({type:n,selectors:[["nz-demo-image-preview-group"]],decls:3,vars:0,consts:[["nz-image","","width","200px","nzSrc","https://img.alicdn.com/tfs/TB1g.mWZAL0gK0jSZFtXXXQCXXa-200-200.svg","alt",""],["nz-image","","width","200px","nzSrc","https://img.alicdn.com/tfs/TB1Z0PywTtYBeNjy1XdXXXXyVXa-186-200.svg","alt",""]],template:function(t,a){1&t&&(e.I0R(0,"nz-image-group"),e.wR5(1,"img",0)(2,"img",1),e.C$Y())},dependencies:[r.Ok,r.qS],encapsulation:2})}return n})(),F=(()=>{class n{constructor(o){this.nzImageService=o}onClick(){this.nzImageService.preview([{src:"https://img.alicdn.com/tfs/TB1g.mWZAL0gK0jSZFtXXXQCXXa-200-200.svg",width:"200px",height:"200px",alt:"ng-zorro"},{src:"https://img.alicdn.com/tfs/TB1Z0PywTtYBeNjy1XdXXXXyVXa-186-200.svg",width:"200px",height:"200px",alt:"angular"}],{nzZoom:1.5,nzRotate:0})}static#e=this.\u0275fac=function(t){return new(t||n)(e.GI1(r.S8))};static#n=this.\u0275cmp=e.In1({type:n,selectors:[["nz-demo-image-service"]],decls:2,vars:0,consts:[["nz-button","","nzType","primary",3,"click"]],template:function(t,a){1&t&&(e.I0R(0,"button",0),e.qCj("click",function(){return a.onClick()}),e.OEk(1,"Preview"),e.C$Y())},dependencies:[c.Ez,m.k,I.o9],encapsulation:2})}return n})(),y=(()=>{class n{constructor(){this.expanded=!1}goLink(o){window&&(window.location.hash=o)}expandAllCode(){this.expanded=!this.expanded,this.codeBoxes.forEach(o=>{o.nzExpanded=this.expanded,o.expandCode(this.expanded),o.check()})}static#e=this.\u0275fac=function(t){return new(t||n)};static#n=this.\u0275cmp=e.In1({type:n,selectors:[["nz-demo-image"]],viewQuery:function(t,a){if(1&t&&e.CC$(l.A,5),2&t){let d;e.wto(d=e.Gqi())&&(a.codeBoxes=d)}},decls:487,vars:31,consts:[[1,"toc-affix",3,"nzOffsetTop"],["nzShowInkInFixed","",3,"nzAffix","nzClick"],["nzHref","#components-image-demo-basic","nzTitle","\u57fa\u672c\u7528\u6cd5"],["nzHref","#components-image-demo-fallback","nzTitle","\u5bb9\u9519\u5904\u7406"],["nzHref","#components-image-demo-placeholder","nzTitle","\u6e10\u8fdb\u52a0\u8f7d"],["nzHref","#components-image-demo-preview-group","nzTitle","\u591a\u5f20\u56fe\u7247\u9884\u89c8"],["nzHref","#components-image-demo-service","nzTitle","\u670d\u52a1\u65b9\u5f0f\u521b\u5efa\u9884\u89c8\u5c42"],["nzHref","#components-image-demo-controlled-preview","nzTitle","\u53d7\u63a7\u7684\u9884\u89c8"],["nzHref","#api","nzTitle","API"],[1,"markdown"],[1,"subtitle"],[1,"widget"],["aria-label","Edit this page on Github","href","https://github.com/NG-ZORRO/ng-zorro-antd/edit/master/components/image/doc/index.zh-CN.md","target","_blank","rel","noopener noreferrer",1,"edit-button"],["nz-icon","","nzType","edit"],["id","\u4f55\u65f6\u4f7f\u7528"],["onclick","window.location.hash = '\u4f55\u65f6\u4f7f\u7528'",1,"anchor"],[1,"language-ts"],[1,"token","keyword"],[1,"token","punctuation"],[1,"token","string"],["nz-icon","","nzType","appstore","nz-tooltip","","nzTooltipTitle","\u5c55\u5f00\u5168\u90e8\u4ee3\u7801",1,"code-box-expand-trigger",3,"click"],["nz-row","",3,"nzGutter"],["nz-col","",3,"nzXl","nzSpan"],["nzTitle","\u57fa\u672c\u7528\u6cd5","nzSelector","nz-demo-image-basic","nzGenerateCommand","ng g ng-zorro-antd:image-basic <name>","nzComponentName","NzDemoImageBasicComponent","nzIframeSource","null",3,"nzId","nzLink","nzIframeHeight","nzHref"],["demo",""],["intro",""],["nzTitle","\u6e10\u8fdb\u52a0\u8f7d","nzSelector","nz-demo-image-placeholder","nzGenerateCommand","ng g ng-zorro-antd:image-placeholder <name>","nzComponentName","NzDemoImagePlaceholderComponent","nzIframeSource","null",3,"nzId","nzLink","nzIframeHeight","nzHref"],["nzTitle","\u670d\u52a1\u65b9\u5f0f\u521b\u5efa\u9884\u89c8\u5c42","nzSelector","nz-demo-image-service","nzGenerateCommand","ng g ng-zorro-antd:image-service <name>","nzComponentName","NzDemoImageServiceComponent","nzIframeSource","null",3,"nzId","nzLink","nzIframeHeight","nzHref"],["nzTitle","\u5bb9\u9519\u5904\u7406","nzSelector","nz-demo-image-fallback","nzGenerateCommand","ng g ng-zorro-antd:image-fallback <name>","nzComponentName","NzDemoImageFallbackComponent","nzIframeSource","null",3,"nzId","nzLink","nzIframeHeight","nzHref"],["nzTitle","\u591a\u5f20\u56fe\u7247\u9884\u89c8","nzSelector","nz-demo-image-preview-group","nzGenerateCommand","ng g ng-zorro-antd:image-preview-group <name>","nzComponentName","NzDemoImagePreviewGroupComponent","nzIframeSource","null",3,"nzId","nzLink","nzIframeHeight","nzHref"],["nzTitle","\u53d7\u63a7\u7684\u9884\u89c8","nzSelector","nz-demo-image-controlled-preview","nzGenerateCommand","ng g ng-zorro-antd:image-controlled-preview <name>","nzComponentName","NzDemoImageControlledPreviewComponent","nzIframeSource","null",3,"nzId","nzLink","nzIframeHeight","nzHref"],[1,"markdown","api-container"],["id","api"],["onclick","window.location.hash = 'api'",1,"anchor"],["id","[nz-image]:standalone"],[1,"api-type-label","directive"],[1,"api-type-label","standalone"],["onclick","window.location.hash = '[nz-image]:standalone'",1,"anchor"],["href","https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#Attributes","target","_blank","rel","noopener"],["id","nzimageservice"],[1,"api-type-label","service"],["onclick","window.location.hash = 'nzimageservice'",1,"anchor"],["id","\u76f8\u5173\u7c7b\u578b\u5b9a\u4e49"],["onclick","window.location.hash = '\u76f8\u5173\u7c7b\u578b\u5b9a\u4e49'",1,"anchor"],["id","nzimage"],["onclick","window.location.hash = 'nzimage'",1,"anchor"],["id","nzimagepreviewoptions"],["onclick","window.location.hash = 'nzimagepreviewoptions'",1,"anchor"],["id","nzimagepreviewref"],["onclick","window.location.hash = 'nzimagepreviewref'",1,"anchor"],["id","nzimagegroupcomponent:standalone"],["onclick","window.location.hash = 'nzimagegroupcomponent:standalone'",1,"anchor"]],template:function(t,a){1&t&&(e.I0R(0,"article")(1,"nz-affix",0)(2,"nz-anchor",1),e.qCj("nzClick",function(u){return a.goLink(u)}),e.wR5(3,"nz-link",2)(4,"nz-link",3)(5,"nz-link",4)(6,"nz-link",5)(7,"nz-link",6)(8,"nz-link",7)(9,"nz-link",8),e.C$Y()(),e.I0R(10,"section",9)(11,"h1"),e.OEk(12,"Image"),e.I0R(13,"span",10),e.OEk(14,"\u56fe\u7247"),e.C$Y(),e.wR5(15,"span",11),e.I0R(16,"a",12),e.wR5(17,"span",13),e.C$Y()(),e.I0R(18,"section",9),e.EdD(),e.I0R(19,"p"),e.OEk(20,"\u53ef\u9884\u89c8\u7684\u56fe\u7247\u3002"),e.C$Y(),e.I0R(21,"h2",14)(22,"span"),e.OEk(23,"\u4f55\u65f6\u4f7f\u7528"),e.C$Y(),e.I0R(24,"a",15),e.OEk(25,"#"),e.C$Y()(),e.I0R(26,"ul")(27,"li"),e.OEk(28,"\u9700\u8981\u5c55\u793a\u56fe\u7247\u65f6\u4f7f\u7528\u3002"),e.C$Y(),e.I0R(29,"li"),e.OEk(30,"\u52a0\u8f7d\u5927\u56fe\u65f6\u6e10\u8fdb\u52a0\u8f7d\u6216\u52a0\u8f7d\u5931\u8d25\u65f6\u5bb9\u9519\u5904\u7406\u3002"),e.C$Y()(),e.I0R(31,"pre",16)(32,"code")(33,"span",17),e.OEk(34,"import"),e.C$Y(),e.OEk(35," "),e.I0R(36,"span",18),e.OEk(37,"{"),e.C$Y(),e.OEk(38," NzImageModule "),e.I0R(39,"span",18),e.OEk(40,"}"),e.C$Y(),e.OEk(41," "),e.I0R(42,"span",17),e.OEk(43,"from"),e.C$Y(),e.OEk(44," "),e.I0R(45,"span",19),e.OEk(46,"'ng-zorro-antd/image'"),e.C$Y(),e.I0R(47,"span",18),e.OEk(48,";"),e.C$Y()()(),e.eAF(),e.C$Y(),e.I0R(49,"h2")(50,"span"),e.OEk(51,"\u4ee3\u7801\u6f14\u793a"),e.C$Y(),e.I0R(52,"span",20),e.qCj("click",function(){return a.expandAllCode()}),e.C$Y()()(),e.I0R(53,"div",21)(54,"div",22)(55,"nz-code-box",23),e.wR5(56,"nz-demo-image-basic",24),e.I0R(57,"div",25),e.EdD(),e.I0R(58,"p"),e.OEk(59,"\u5355\u51fb\u56fe\u50cf\u53ef\u4ee5\u653e\u5927\u663e\u793a\u3002"),e.C$Y(),e.eAF(),e.C$Y()(),e.I0R(60,"nz-code-box",26),e.wR5(61,"nz-demo-image-placeholder",24),e.I0R(62,"div",25),e.EdD(),e.I0R(63,"p"),e.OEk(64,"\u5927\u56fe\u4f7f\u7528 placeholder \u6e10\u8fdb\u52a0\u8f7d\u3002"),e.C$Y(),e.eAF(),e.C$Y()(),e.I0R(65,"nz-code-box",27),e.wR5(66,"nz-demo-image-service",24),e.I0R(67,"div",25),e.EdD(),e.I0R(68,"p"),e.OEk(69,"\u56fe\u7247\u9884\u89c8\u7684 Service \u7528\u6cd5\uff0c\u793a\u4f8b\u4e2d\u5305\u542b\u4f7f\u7528 Service \u521b\u5efa\u5355\u5f20\u6216\u591a\u5f20\u56fe\u7247\u9884\u89c8\u7684\u7528\u6cd5"),e.C$Y(),e.eAF(),e.C$Y()()(),e.I0R(70,"div",22)(71,"nz-code-box",28),e.wR5(72,"nz-demo-image-fallback",24),e.I0R(73,"div",25),e.EdD(),e.I0R(74,"p"),e.OEk(75,"\u52a0\u8f7d\u5931\u8d25\u663e\u793a\u56fe\u50cf\u5360\u4f4d\u7b26\u3002"),e.C$Y(),e.eAF(),e.C$Y()(),e.I0R(76,"nz-code-box",29),e.wR5(77,"nz-demo-image-preview-group",24),e.I0R(78,"div",25),e.EdD(),e.I0R(79,"p"),e.OEk(80,"\u70b9\u51fb\u5de6\u53f3\u5207\u6362\u6309\u94ae\u53ef\u4ee5\u9884\u89c8\u591a\u5f20\u56fe\u7247\u3002"),e.C$Y(),e.eAF(),e.C$Y()(),e.I0R(81,"nz-code-box",30),e.wR5(82,"nz-demo-image-controlled-preview",24),e.I0R(83,"div",25),e.EdD(),e.I0R(84,"p"),e.OEk(85,"\u53ef\u4ee5\u4f7f\u9884\u89c8\u53d7\u63a7\u3002"),e.C$Y(),e.eAF(),e.C$Y()()()(),e.I0R(86,"section",31),e.EdD(),e.I0R(87,"h2",32)(88,"span"),e.OEk(89,"API"),e.C$Y(),e.I0R(90,"a",33),e.OEk(91,"#"),e.C$Y()(),e.I0R(92,"h3",34)(93,"span"),e.OEk(94,"[nz-image]"),e.C$Y(),e.I0R(95,"label",35),e.OEk(96,"directive"),e.C$Y(),e.I0R(97,"label",36),e.OEk(98,"standalone"),e.C$Y(),e.I0R(99,"a",37),e.OEk(100,"#"),e.C$Y()(),e.I0R(101,"table")(102,"thead")(103,"tr")(104,"th"),e.OEk(105,"\u53c2\u6570"),e.C$Y(),e.I0R(106,"th"),e.OEk(107,"\u8bf4\u660e"),e.C$Y(),e.I0R(108,"th"),e.OEk(109,"\u7c7b\u578b"),e.C$Y(),e.I0R(110,"th"),e.OEk(111,"\u9ed8\u8ba4\u503c"),e.C$Y(),e.I0R(112,"th"),e.OEk(113,"\u652f\u6301\u5168\u5c40\u914d\u7f6e"),e.C$Y()()(),e.I0R(114,"tbody")(115,"tr")(116,"td"),e.OEk(117,"nzSrc"),e.C$Y(),e.I0R(118,"td"),e.OEk(119,"\u56fe\u7247\u5730\u5740"),e.C$Y(),e.I0R(120,"td")(121,"code"),e.OEk(122,"string"),e.C$Y()(),e.I0R(123,"td"),e.OEk(124,"-"),e.C$Y(),e.I0R(125,"td"),e.OEk(126,"-"),e.C$Y()(),e.I0R(127,"tr")(128,"td"),e.OEk(129,"nzFallback"),e.C$Y(),e.I0R(130,"td"),e.OEk(131,"\u52a0\u8f7d\u5931\u8d25\u5bb9\u9519\u5730\u5740"),e.C$Y(),e.I0R(132,"td")(133,"code"),e.OEk(134,"string"),e.C$Y()(),e.I0R(135,"td"),e.OEk(136,"-"),e.C$Y(),e.I0R(137,"td"),e.OEk(138,"\u2705"),e.C$Y()(),e.I0R(139,"tr")(140,"td"),e.OEk(141,"nzPlaceholder"),e.C$Y(),e.I0R(142,"td"),e.OEk(143,"\u52a0\u8f7d\u5360\u4f4d\u5730\u5740"),e.C$Y(),e.I0R(144,"td")(145,"code"),e.OEk(146,"string"),e.C$Y()(),e.I0R(147,"td"),e.OEk(148,"-"),e.C$Y(),e.I0R(149,"td"),e.OEk(150,"\u2705"),e.C$Y()(),e.I0R(151,"tr")(152,"td"),e.OEk(153,"nzDisablePreview"),e.C$Y(),e.I0R(154,"td"),e.OEk(155,"\u662f\u5426\u7981\u6b62\u9884\u89c8"),e.C$Y(),e.I0R(156,"td")(157,"code"),e.OEk(158,"boolean"),e.C$Y()(),e.I0R(159,"td")(160,"code"),e.OEk(161,"false"),e.C$Y()(),e.I0R(162,"td"),e.OEk(163,"\u2705"),e.C$Y()(),e.I0R(164,"tr")(165,"td"),e.OEk(166,"nzCloseOnNavigation"),e.C$Y(),e.I0R(167,"td"),e.OEk(168,"\u5f53\u7528\u6237\u5728\u5386\u53f2\u4e2d\u524d\u8fdb/\u540e\u9000\u65f6\u662f\u5426\u5173\u95ed\u9884\u89c8\u3002\u6ce8\u610f\uff0c\u8fd9\u901a\u5e38\u4e0d\u5305\u62ec\u70b9\u51fb\u94fe\u63a5\uff08\u9664\u975e\u7528\u6237\u4f7f\u7528 HashLocationStrategy\uff09\u3002"),e.C$Y(),e.I0R(169,"td")(170,"code"),e.OEk(171,"boolean"),e.C$Y()(),e.I0R(172,"td")(173,"code"),e.OEk(174,"fal

1se"),e.C$Y()(),e.I0R(175,"td"),e.OEk(176,"\u2705"),e.C$Y()(),e.I0R(177,"tr")(178,"td"),e.OEk(179,"nzDirection"),e.C$Y(),e.I0R(180,"td"),e.OEk(181,"\u6587\u5b57\u65b9\u5411"),e.C$Y(),e.I0R(182,"td")(183,"code"),e.OEk(184,"Direction"),e.C$Y()(),e.I0R(185,"td")(186,"code"),e.OEk(187,"'ltr'"),e.C$Y()(),e.I0R(188,"td"),e.OEk(189,"\u2705"),e.C$Y()(),e.I0R(190,"tr")(191,"td"),e.OEk(192,"nzScaleStep"),e.C$Y(),e.I0R(193,"td")(194,"code"),e.OEk(195,"1 + nzScaleStep"),e.C$Y(),e.OEk(196," \u4e3a\u7f29\u653e\u653e\u5927\u7684\u6bcf\u6b65\u500d\u6570"),e.C$Y(),e.I0R(197,"td")(198,"code"),e.OEk(199,"number"),e.C$Y()(),e.I0R(200,"td"),e.OEk(201,"0.5"),e.C$Y(),e.I0R(202,"td"),e.OEk(203,"\u2705"),e.C$Y()()()(),e.I0R(204,"p"),e.OEk(205,"\u5176\u4ed6\u5c5e\u6027\u89c1 "),e.I0R(206,"a",38),e.OEk(207,"<img>"),e.C$Y()(),e.I0R(208,"h3",39)(209,"span"),e.OEk(210,"NzImageService"),e.C$Y(),e.I0R(211,"label",40),e.OEk(212,"service"),e.C$Y(),e.I0R(213,"a",41),e.OEk(214,"#"),e.C$Y()(),e.I0R(215,"table")(216,"thead")(217,"tr")(218,"th"),e.OEk(219,"\u53c2\u6570"),e.C$Y(),e.I0R(220,"th"),e.OEk(221,"\u8bf4\u660e"),e.C$Y(),e.I0R(222,"th"),e.OEk(223,"\u7c7b\u578b"),e.C$Y(),e.I0R(224,"th"),e.OEk(225,"\u9ed8\u8ba4\u503c"),e.C$Y()()(),e.I0R(226,"tbody")(227,"tr")(228,"td"),e.OEk(229,"images"),e.C$Y(),e.I0R(230,"td"),e.OEk(231,"\u9884\u89c8\u56fe\u7247"),e.C$Y(),e.I0R(232,"td")(233,"code"),e.OEk(234,"NzImage[]"),e.C$Y()(),e.I0R(235,"td"),e.OEk(236,"-"),e.C$Y()(),e.I0R(237,"tr")(238,"td"),e.OEk(239,"options"),e.C$Y(),e.I0R(240,"td"),e.OEk(241,"\u9884\u89c8\u53c2\u6570"),e.C$Y(),e.I0R(242,"td")(243,"code"),e.OEk(244,"NzImagePreviewOptions"),e.C$Y()(),e.I0R(245,"td"),e.OEk(246,"-"),e.C$Y()()()(),e.I0R(247,"h2",42)(248,"span"),e.OEk(249,"\u76f8\u5173\u7c7b\u578b\u5b9a\u4e49"),e.C$Y(),e.I0R(250,"a",43),e.OEk(251,"#"),e.C$Y()(),e.I0R(252,"h3",44)(253,"span"),e.OEk(254,"NzImage"),e.C$Y(),e.I0R(255,"a",45),e.OEk(256,"#"),e.C$Y()(),e.I0R(257,"table")(258,"thead")(259,"tr")(260,"th"),e.OEk(261,"\u53c2\u6570"),e.C$Y(),e.I0R(262,"th"),e.OEk(263,"\u8bf4\u660e"),e.C$Y(),e.I0R(264,"th"),e.OEk(265,"\u7c7b\u578b"),e.C$Y(),e.I0R(266,"th"),e.OEk(267,"\u9ed8\u8ba4\u503c"),e.C$Y()()(),e.I0R(268,"tbody")(269,"tr")(270,"td"),e.OEk(271,"src"),e.C$Y(),e.I0R(272,"td"),e.OEk(273,"src"),e.C$Y(),e.I0R(274,"td")(275,"code"),e.OEk(276,"string"),e.C$Y()(),e.I0R(277,"td"),e.OEk(278,"-"),e.C$Y()(),e.I0R(279,"tr")(280,"td"),e.OEk(281,"alt"),e.C$Y(),e.I0R(282,"td"),e.OEk(283,"alt"),e.C$Y(),e.I0R(284,"td")(285,"code"),e.OEk(286,"string"),e.C$Y()(),e.I0R(287,"td"),e.OEk(288,"-"),e.C$Y()(),e.I0R(289,"tr")(290,"td"),e.OEk(291,"width"),e.C$Y(),e.I0R(292,"td"),e.OEk(293,"\u56fe\u7247\u5bbd\u5ea6"),e.C$Y(),e.I0R(294,"td")(295,"code"),e.OEk(296,"string"),e.C$Y()(),e.I0R(297,"td"),e.OEk(298,"-"),e.C$Y()(),e.I0R(299,"tr")(300,"td"),e.OEk(301,"height"),e.C$Y(),e.I0R(302,"td"),e.OEk(303,"\u56fe\u7247\u9ad8\u5ea6"),e.C$Y(),e.I0R(304,"td")(305,"code"),e.OEk(306,"string"),e.C$Y()(),e.I0R(307,"td"),e.OEk(308,"-"),e.C$Y()()()(),e.I0R(309,"h3",46)(310,"span"),e.OEk(311,"NzImagePreviewOptions"),e.C$Y(),e.I0R(312,"a",47),e.OEk(313,"#"),e.C$Y()(),e.I0R(314,"table")(315,"thead")(316,"tr")(317,"th"),e.OEk(318,"\u53c2\u6570"),e.C$Y(),e.I0R(319,"th"),e.OEk(320,"\u8bf4\u660e"),e.C$Y(),e.I0R(321,"th"),e.OEk(322,"\u7c7b\u578b"),e.C$Y(),e.I0R(323,"th"),e.OEk(324,"\u9ed8\u8ba4\u503c"),e.C$Y()()(),e.I0R(325,"tbody")(326,"tr")(327,"td"),e.OEk(328,"nzKeyboard"),e.C$Y(),e.I0R(329,"td"),e.OEk(330,"\u662f\u5426\u652f\u6301\u952e\u76d8 esc \u5173\u95ed\u3001\u5de6\u53f3\u952e\u5207\u6362\u56fe\u7247"),e.C$Y(),e.I0R(331,"td")(332,"code"),e.OEk(333,"boolean"),e.C$Y()(),e.I0R(334,"td")(335,"code"),e.OEk(336,"true"),e.C$Y()()(),e.I0R(337,"tr")(338,"td"),e.OEk(339,"nzMaskClosable"),e.C$Y(),e.I0R(340,"td"),e.OEk(341,"\u70b9\u51fb\u8499\u5c42\u662f\u5426\u5141\u8bb8\u5173\u95ed"),e.C$Y(),e.I0R(342,"td")(343,"code"),e.OEk(344,"boolean"),e.C$Y()(),e.I0R(345,"td")(346,"code"),e.OEk(347,"true"),e.C$Y()()(),e.I0R(348,"tr")(349,"td"),e.OEk(350,"nzCloseOnNavigation"),e.C$Y(),e.I0R(351,"td"),e.OEk(352,"\u5f53\u7528\u6237\u5728\u5386\u53f2\u4e2d\u524d\u8fdb/\u540e\u9000\u65f6\u662f\u5426\u5173\u95ed\u9884\u89c8\u3002\u6ce8\u610f\uff0c\u8fd9\u901a\u5e38\u4e0d\u5305\u62ec\u70b9\u51fb\u94fe\u63a5\uff08\u9664\u975e\u7528\u6237\u4f7f\u7528 HashLocationStrategy\uff09\u3002"),e.C$Y(),e.I0R(353,"td")(354,"code"),e.OEk(355,"boolean"),e.C$Y()(),e.I0R(356,"td")(357,"code"),e.OEk(358,"true"),e.C$Y()()(),e.I0R(359,"tr")(360,"td"),e.OEk(361,"nzZIndex"),e.C$Y(),e.I0R(362,"td"),e.OEk(363,"\u8bbe\u7f6e\u9884\u89c8\u5c42\u7684 z-index"),e.C$Y(),e.I0R(364,"td")(365,"code"),e.OEk(366,"number"),e.C$Y()(),e.I0R(367,"td"),e.OEk(368,"1000"),e.C$Y()(),e.I0R(369,"tr")(370,"td"),e.OEk(371,"nzZoom"),e.C$Y(),e.I0R(372,"td"),e.OEk(373,"\u7f29\u653e\u6bd4\u4f8b"),e.C$Y(),e.I0R(374,"td")(375,"code"),e.OEk(376,"number"),e.C$Y()(),e.I0R(377,"td"),e.OEk(378,"1"),e.C$Y()(),e.I0R(379,"tr")(380,"td"),e.OEk(381,"nzRotate"),e.C$Y(),e.I0R(382,"td"),e.OEk(383,"\u65cb\u8f6c\u89d2\u5ea6"),e.C$Y(),e.I0R(384,"td")(385,"code"),e.OEk(386,"number"),e.C$Y()(),e.I0R(387,"td"),e.OEk(388,"0"),e.C$Y()(),e.I0R(389,"tr")(390,"td"),e.OEk(391,"nzScaleStep"),e.C$Y(),e.I0R(392,"td")(393,"code"),e.OEk(394,"1 + nzScaleStep"),e.C$Y(),e.OEk(395," \u4e3a\u7f29\u653e\u653e\u5927\u7684\u6bcf\u6b65\u500d\u6570"),e.C$Y(),e.I0R(396,"td")(397,"code"),e.OEk(398,"number"),e.C$Y()(),e.I0R(399,"td"),e.OEk(400,"0.5"),e.C$Y()(),e.I0R(401,"tr")(402,"td"),e.OEk(403,"nzFlipHorizontally"),e.C$Y(),e.I0R(404,"td"),e.OEk(405,"\u5728\u6c34\u5e73\u54

111\u91cf\u4e0a\u7ffb\u8f6c\u56fe\u50cf"),e.C$Y(),e.I0R(406,"td")(407,"code"),e.OEk(408,"boolean"),e.C$Y()(),e.I0R(409,"td")(410,"code"),e.OEk(411,"false"),e.C$Y()()(),e.I0R(412,"tr")(413,"td"),e.OEk(414,"nzFlipVertically"),e.C$Y(),e.I0R(415,"td"),e.OEk(416,"\u5728\u5782\u76f4\u5411\u91cf\u4e0a\u7ffb\u8f6c\u56fe\u50cf"),e.C$Y(),e.I0R(417,"td")(418,"code"),e.OEk(419,"boolean"),e.C$Y()(),e.I0R(420,"td")(421,"code"),e.OEk(422,"false"),e.C$Y()()()()(),e.I0R(423,"h3",48)(424,"span"),e.OEk(425,"NzImagePreviewRef"),e.C$Y(),e.I0R(426,"a",49),e.OEk(427,"#"),e.C$Y()(),e.I0R(428,"table")(429,"thead")(430,"tr")(431,"th"),e.OEk(432,"\u540d\u79f0"),e.C$Y(),e.I0R(433,"th"),e.OEk(434,"\u63cf\u8ff0"),e.C$Y()()(),e.I0R(435,"tbody")(436,"tr")(437,"td"),e.OEk(438,"switchTo(index: number): void"),e.C$Y(),e.I0R(439,"td"),e.OEk(440,"\u8bbe\u7f6e\u9884\u89c8\u7d22\u5f15"),e.C$Y()(),e.I0R(441,"tr")(442,"td"),e.OEk(443,"prev(): void"),e.C$Y(),e.I0R(444,"td"),e.OEk(445,"\u4e0a\u4e00\u5f20"),e.C$Y()(),e.I0R(446,"tr")(447,"td"),e.OEk(448,"next(): void"),e.C$Y(),e.I0R(449,"td"),e.OEk(450,"\u4e0b\u4e00\u5f20"),e.C$Y()(),e.I0R(451,"tr")(452,"td"),e.OEk(453,"close(): void"),e.C$Y(),e.I0R(454,"td"),e.OEk(455,"\u5173\u95ed\u9884\u89c8"),e.C$Y()()()(),e.I0R(456,"h3",50)(457,"span"),e.OEk(458,"NzImageGroupComponent"),e.C$Y(),e.I0R(459,"label",36),e.OEk(460,"standalone"),e.C$Y(),e.I0R(461,"a",51),e.OEk(462,"#"),e.C$Y()(),e.I0R(463,"table")(464,"thead")(465,"tr")(466,"th"),e.OEk(467,"\u540d\u79f0"),e.C$Y(),e.I0R(468,"th"),e.OEk(469,"\u63cf\u8ff0"),e.C$Y(),e.I0R(470,"th"),e.OEk(471,"\u7c7b\u578b"),e.C$Y(),e.I0R(472,"th"),e.OEk(473,"\u9ed8\u8ba4\u503c"),e.C$Y()()(),e.I0R(474,"tbody")(475,"tr")(476,"td"),e.OEk(477,"nzScaleStep"),e.C$Y(),e.I0R(478,"td")(479,"code"),e.OEk(480,"1 + nzScaleStep"),e.C$Y(),e.OEk(481," \u4e3a\u7f29\u653e\u653e\u5927\u7684\u6bcf\u6b65\u500d\u6570"),e.C$Y(),e.I0R(482,"td")(483,"code"),e.OEk(484,"number"),e.C$Y()(),e.I0R(485,"td"),e.OEk(486,"-"),e.C$Y()()()(),e.eAF(),e.C$Y()()),2&t&&(e.yG2(),e.E7m("nzOffsetTop",16),e.yG2(),e.E7m("nzAffix",!1),e.yG2(51),e.E7m("nzGutter",16),e.yG2(),e.E7m("nzXl",12)("nzSpan",24),e.yG2(),e.E7m("nzId","components-image-demo-basic")("nzLink","components-image-demo-basic")("nzIframeHeight",null)("nzHref","https://github.com/NG-ZORRO/ng-zorro-antd/edit/master/components/image/demo/basic.md"),e.yG2(5),e.E7m("nzId","components-image-demo-placeholder")("nzLink","components-image-demo-placeholder")("nzIframeHeight",null)("nzHref","https://github.com/NG-ZORRO/ng-zorro-antd/edit/master/components/image/demo/placeholder.md"),e.yG2(5),e.E7m("nzId","components-image-demo-service")("nzLink","components-image-demo-service")("nzIframeHeight",null)("nzHref","https://github.com/NG-ZORRO/ng-zorro-antd/edit/master/components/image/demo/service.md"),e.yG2(5),e.E7m("nzXl",12)("nzSpan",24),e.yG2(),e.E7m("nzId","components-image-demo-fallback")("nzLink","components-image-demo-fallback")("nzIframeHeight",null)("nzHref","https://github.com/NG-ZORRO/ng-zorro-antd/edit/master/components/image/demo/fallback.md"),e.yG2(5),e.E7m("nzId","components-image-demo-preview-group")("nzLink","components-image-demo-preview-group")("nzIframeHeight",null)("nzHref","https://github.com/NG-ZORRO/ng-zorro-antd/edit/master/components/image/demo/preview-group.md"),e.yG2(5),e.E7m("nzId","components-image-demo-controlled-preview")("nzLink","components-image-demo-controlled-preview")("nzIframeHeight",null)("nzHref","https://github.com/NG-ZORRO/ng-zorro-antd/edit/master/components/image/demo/controlled-preview.md"))},dependencies:[l.A,E.s9,E.mK,k.g,s.QD,s.ox,p.qG,R.If,m.k,h,Y,$,A,f,F],encapsulation:2})}return n})(),S=(()=>{class n{constructor(){this.expanded=!1}goLink(o){window&&(window.location.hash=o)}expandAllCode(){this.expanded=!this.expanded,this.codeBoxes.forEach(o=>{o.nzExpanded=this.expanded,o.expandCode(this.expanded),o.check()})}static#e=this.\u0275fac=function(t){return new(t||n)};static#n=this.\u0275cmp=e.In1({type:n,selectors:[["nz-demo-image"]],viewQuery:function(t,a){if(1&t&&e.CC$(l.A,5),2&t){let d;e.wto(d=e.Gqi())&&(a.codeBoxes=d)}},decls:505,vars:31,consts:[[1,"toc-affix",3,"nzOffsetTop"],["nzShowInkInFixed","",3,"nzAffix","nzClick"],["nzHref","#components-image-demo-basic","nzTitle","Basic Usage"],["nzHref","#components-image-demo-fallback","nzTitle","Fault tolerant"],["nzHref","#components-image-demo-placeholder","nzTitle","Progressive Loading"],["nzHref","#components-image-demo-preview-group","nzTitle","Multiple image preview"],["nzHref","#components-image-demo-service","nzTitle","Image Preview Service"],["nzHref","#components-image-demo-controlled-preview","nzTitle","Controlled Preview"],["nzHref","#api","nzTitle","API"],[1,"markdown"],[1,"subtitle"],[1,"widget"],["aria-label","Edit this page on Github","href","https://github.com/NG-ZORRO/ng-zorro-antd/edit/master/components/image/doc/index.en-US.md","target","_blank","rel","noopener noreferrer",1,"edit-button"],["nz-icon","","nzType","edit"],["id","when-to-use"],["onclick","window.location.hash = 'when-to-use'",1,"anchor"],[1,"language-ts"],[1,"token","keyword"],[1,"token","punctuation"],[1,"token","string"],["nz-icon","","nzType","appstore","nz-tooltip","","nzTooltipTitle","Expand All Code",1,"code-box-expand-trigger",3,"click"],["nz-row","",3,"nzGutter"],["nz-col","",3,"nzXl","nzSpan"],["nzTitle","Basic Usage","nzSelector","nz-demo-image-basic","nzGenerateCommand","ng g ng-zorro-antd:image-basic <name>","nzComponentName","NzDemoImageBasicComponent","nzIframeSource","null",3,"nzId","nzLink","nzIframeHeight","nzHref"],["demo",""],["intro",""],["nzTitle","Progressive Loading","nzSelector","nz-demo-image-placeholder","nzGenerateCommand","ng g ng-zorro-antd:image-placeholder <name>","nzComponentName","NzDemoImagePlaceholderComponent","nzIframeSource","null",3,"nzId","nzLink","nzIframeHeight","nzHref"],["nzTitle","Image Preview Service","nzSelector","nz-demo-image-service","nzGenerateCommand","ng g ng-zorro-antd:image-service <name>","nzComponentName","NzDemoImageServiceComponent","nzIframeSource","null",3,"nzId","nzLink","nzIframeHeight","nzHref"],["nzTitle","Fault tolerant","nzSelector","nz-demo-image-fallback","nzGenerateCommand","ng g ng-zorro-antd:image-fallback <name>","nzComponentName","NzDemoImageFallbackComponent","nzIframeSource","null",3,"nzId","nzLink","nzIframeHeight","nzHref"],["nzTitle","Multiple image preview","nzSelector","nz-demo-image-preview-group","nzGenerateCommand","ng g ng-zorro-antd:image-preview-group <name>","nzComponentName","NzDemoImagePreviewGroupComponent","nzIframeSource","null",3,"nzId","nzLink","nzIframeHeight","nzHref"],["nzTitle","Controlled Preview","nzSelector","nz-demo-image-controlled-preview","nzGenerateCommand","ng g ng-zorro-antd:image-controlled-preview <name>","nzComponentName","NzDemoImageControlledPreviewComponent","nzIframeSource","null",3,"nzId","nzLink","nzIframeHeight","nzHref"],[1,"markdown","api-container"],["id","api"],["onclick","window.location.hash = 'api'",1,"anchor"],["id","[nz-image]:standalone"],[1,"api-type-label","directive"],[1,"api-type-label","standalone"],["onclick","window.location.hash = '[nz-image]:standalone'",1,"anchor"],["href","https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#Attributes","target","_blank","rel","noopener"],["id","nzimageservice"],[1,"api-type-label","service"],["onclick","window.location.hash = 'nzimageservice'",1,"anchor"],["id","related-type-definition"],["onclick","window.location.hash = 'related-type-definition'",1,"anchor"],["id","nzimage"],["onclick","window.location.hash = 'nzimage'",1,"anchor"],["id","nzimagepreviewoptions"],["onclick","window.location.hash = 'nzimagepreviewoptions'",1,"anchor"],["id","nzimagepreviewref"],["onclick","window.location.hash = 'nzimagepreviewref'",1,"anchor"],["id","nzimagegroupcomponent:standalone"],["onclick","window.location.hash = 'nzimagegroupcomponent:standalone'",1,"anchor"]],template:function(t,a){1&t&&(e.I0R(0,"article")(1,"nz-affix",0)(2,"nz-anchor",1),e.qCj("nzClick",function(u){return a.goLink(u)}),e.wR5(3,"nz-link",2)(4,"nz-link",3)(5,"nz-link",4)(6,"nz-link",5)(7,"nz-link",6)(8,"nz-link",7)(9,"nz-link",8),e.C$Y()(),e.I0R(10,"section",9)(11,"h1"),e.OEk(12,"Image"),e.wR5(13,"span",10)(14,"span",11),e.I0R(15,"a",12),e.wR5(16,"span",13),e.C$Y()(),e.I0R(17,"section",9),e.EdD(),e.I0R(18,"p"),e.OEk(19,"Previewable image."),e.C$Y(),e.I0R(20,"h2",14)(21,"span"),e.OEk(22,"When To Use"),e.C$Y(),e.I0R(23,"a",15),e.OEk(24,"#"),e.C$Y()(),e.I0R(25,"ul")(26,"li"),e.OEk(27,"When you need to display pictures."),e.C$Y(),e.I0R(28,"li"),e.OEk(29,"Display when loading a large image or fault tolerant handling when loading fail."),e.C$Y()(),e.I0R(30,"pre",16)(31,"code")(32,"span",17),e.OEk(33,"import"),e.C$Y(),e.OEk(34," "),e.I0R(35,"span",18),e.OEk(36,"{"),e.C$Y(),e.OEk(37," NzImageModule "),e.I0R(38,"span",18),e.OEk(39,"}"),e.C$Y(),e.OEk(40," "),e.I0R(41,"span",17),e.OEk(42,"from"),e.C$Y(),e.OEk(43," "),e.I0R(44,"span",19),e.OEk(45,"'ng-zorro-antd/image'"),e.C$Y(),e.I0R(46,"span",18),e.OEk(47,";"),e.C$Y()()(),e.eAF(),e.C$Y(),e.I0R(48,"h2")(49,"span"),e.OEk(50,"Examples"),e.C$Y(),e.I0R(51,"span",20),e.qCj("click",function(){return a.expandAllCode()}),e.C$Y()()(),e.I0R(52,"div",21)(53,"div",22)(54,"nz-code-box",23),e.wR5(55,"nz-demo-image-basic",24),e.I0R(56,"div",25),e.EdD(),e.I0R(57,"p"),e.OEk(58,"Click the image to preview."),e.C$Y(),e.eAF(),e.C$Y()(),e.I0R(59,"nz-code-box",26),e.wR5(60,"nz-demo-image-placeholder",24),e.I0R(61,"div",25),e.EdD(),e.I0R(62,"p"),e.OEk(63,"Progressive when large image loading."),e.C$Y(),e.eAF(),e.C$Y()(),e.I0R(64,"nz-code-box",27),e.wR5(65,"nz-demo-image-service",24),e.I0R(66,"div",25),e.EdD(),e.I0R(67,"p"),e.OEk(68,"The usage of "),e.I0R(69,"code"),e.OEk(70,"NzImageService"),e.C$Y(),e.OEk(71," for images preview, the example includes the usage of using "),e.I0R(72,"code"),e.OEk(73,"NzImageService"),e.C$Y(),e.OEk(74," to create single or multiple images preview"),e.C$Y(),e.eAF(),e.C$Y()()(),e.I0R(75,"div",22)(76,"nz-code-box",28),e.wR5(77,"nz-demo-image-fallback",24),e.I0R(78,"div",25),e.EdD(),e.I0R(79,"p"),e.OEk(80,"Load failed to display image placeholder."),e.C$Y(),e.eAF(),e.C$Y()(),e.I0R(81,"nz-code-box",29),e.wR5(82,"nz-demo-image-preview-group",24),e.I0R(83,"div",25),e.EdD(),e.I0R(84,"p"),e.OEk(85,"Click the left and right switch buttons to preview multiple images."),e.C$Y(),e.eAF(),e.C$Y()(),e.I0R(86,"nz-code-box",30),e.wR5(87,"nz-demo-image-controlled-preview",24),e.I0R(88,"div",25),e.EdD(),e.I0R(89,"p"),e.OEk(90,"You can make preview controlled."),e.C$Y(),e.eAF(),e.C$Y()()()(),e.I0R(91,"section",31),e.EdD(),e.I0R(92,"h2",32)(93,"span"),e.OEk(94,"API"),e.C$Y(),e.I0R(95,"a",33),e.OEk(96,"#"),e.C$Y()(),e.I0R(97,"h3",34)(98,"span"),e.OEk(99,"[nz-image]"),e.C$Y(),e.I0R(100,"label",35),e.OEk(101,"directive"),e.C$Y(),e.I0R(102,"label",36),e.OEk(103,"standalone"),e.C$Y(),e.I0R(104,"a",37),e.OEk(105,"#"),e.C$Y()(),e.I0R(106,"table")(107,"thead")(108,"tr")(109,"th"),e.OEk(110,"Property"),e.C$Y(),e.I0R(111,"th"),e.OEk(112,"Description"),e.C$Y(),e.I0R(113,"th"),e.OEk(114,"Type"),e.C$Y(),e.I0R(115,"th"),e.OEk(116,"Default"),e.C$Y(),e.I0R(117,"th"),e.OEk(118,"Global Config"),e.C$Y()()(),e.I0R(119,"tbody")(120,"tr")(121,"td"),e.OEk(122,"nzSrc"),e.C$Y(),e.I0R(123,"td"),e.OEk(124,"Image path"),e.C$Y(),e.I0R(125,"td")(126,"code"),e.OEk(127,"string"),e.C$Y()(),e.I0R(128,"td"),e.OEk(129,"-"),e.C$Y(),e.I0R(130,"td"),e.OEk(131,"-"),e.C$Y()(),e.I0R(132,"tr")(133,"td"),e.OEk(134,"nzFallback"),e.C$Y(),e.I0R(135,"td"),e.OEk(136,"Load failure fault-tolerant src"),e.C$Y(),e.I0R(137,"td")(138,"code"),e.OEk(139,"string"),e.C$Y()(),e.I0R(140,"td"),e.OEk(141,"-"),e.C$Y(),e.I0R(142,"td"),e.OEk(143,"\u2705"),e.C$Y()(),e.I0R(144,"tr")(145,"td"),e.OEk(146,"nzPlaceholder"),e.C$Y(),e.I0R(147,"td"),e.OEk(148,"Load placeholder src"),e.C$Y(),e.I0R(149,"td")(150,"code"),e.OEk(151,"string"),e.C$Y()(),e.I0R(152,"td"),e.OEk(153,"-"),e.C$Y(),e.I0R(154,"td"),e.OEk(155,"\u2705"),e.C$Y()(),e.I0R(156,"tr")(157,"td"),e.OEk(158,"nzDisablePreview"),e.C$Y(),e.I0R(159,"td"),e.OEk(160,"Whether to disable the preview"),e.C$Y(),e.I0R(161,"td")(162,"code"),e.OEk(163,"boolean"),e.C$Y()(),e.I0R(164,"td")(165,"code"),e.OEk(166,"false"),e.C$Y()(),e.I0R(167,"td"),e.OEk(168,"\u2705"),e.C$Y()(),e.I0R(169,"tr")(170,"td"),e.OEk(171,"nzCloseOnNavigation"),e.C$Y(),e.I0R(172,"td"),e.OEk(173,"Whether to close the image preview when the user goes backwards/forwards in history. Note that this usually doesn't include clicking on links (unless the user is using the HashLocationStrategy)."),e.C$Y(),e.I0R(174,"td")(175,"code"),e.OEk(176,"boolean"),e.C$Y()(),e.I0R(177,"td")(178,"code"),e.OEk(179,"false"),e.C$Y()(),e.I0R(180,"td"),e.OEk(181,"\u2705"),e.C$Y()(),e.I0R(182,"tr")(183,"td"),e.OEk(184,"nzDirection"),e.C$Y(),e.I0R(185,"td"),e.OEk(186,"Text directionality"),e.C$Y(),e.I0R(187,"td")(188,"code"),e.OEk(189,"Direction"),e.C$Y()(),e.I0R(190,"td")(191,"code"),e.OEk(192,"'ltr'"),e.C$Y()(),e.I0R(193,"td"),e.OEk(194,"\u2705"),e.C$Y()(),e.I0R(195,"tr")(196,"td"),e.OEk(197,"nzScaleStep"),e.C$Y(),e.I0R(198,"td")(199,"code"),e.OEk(200,"1 + nzScaleStep"),e.C$Y(),e.OEk(201," is the step to increase or decrease the scale"),e.C$Y(),e.I0R(202,"td")(203,"code"),e.OEk(204,"

1number"),e.C$Y()(),e.I0R(205,"td"),e.OEk(206,"0.5"),e.C$Y(),e.I0R(207,"td"),e.OEk(208,"\u2705"),e.C$Y()()()(),e.I0R(209,"p"),e.OEk(210,"Other attributes "),e.I0R(211,"a",38),e.OEk(212,"<img>"),e.C$Y()(),e.I0R(213,"h3",39)(214,"span"),e.OEk(215,"NzImageService"),e.C$Y(),e.I0R(216,"label",40),e.OEk(217,"service"),e.C$Y(),e.I0R(218,"a",41),e.OEk(219,"#"),e.C$Y()(),e.I0R(220,"table")(221,"thead")(222,"tr")(223,"th"),e.OEk(224,"Property"),e.C$Y(),e.I0R(225,"th"),e.OEk(226,"Description"),e.C$Y(),e.I0R(227,"th"),e.OEk(228,"Type"),e.C$Y(),e.I0R(229,"th"),e.OEk(230,"Default"),e.C$Y()()(),e.I0R(231,"tbody")(232,"tr")(233,"td"),e.OEk(234,"images"),e.C$Y(),e.I0R(235,"td"),e.OEk(236,"Preview images"),e.C$Y(),e.I0R(237,"td")(238,"code"),e.OEk(239,"NzImage[]"),e.C$Y()(),e.I0R(240,"td"),e.OEk(241,"-"),e.C$Y()(),e.I0R(242,"tr")(243,"td"),e.OEk(244,"options"),e.C$Y(),e.I0R(245,"td"),e.OEk(246,"Preview options"),e.C$Y(),e.I0R(247,"td")(248,"code"),e.OEk(249,"NzImagePreviewOptions"),e.C$Y()(),e.I0R(250,"td"),e.OEk(251,"-"),e.C$Y()()()(),e.I0R(252,"h2",42)(253,"span"),e.OEk(254,"Related type definition"),e.C$Y(),e.I0R(255,"a",43),e.OEk(256,"#"),e.C$Y()(),e.I0R(257,"h3",44)(258,"span"),e.OEk(259,"NzImage"),e.C$Y(),e.I0R(260,"a",45),e.OEk(261,"#"),e.C$Y()(),e.I0R(262,"table")(263,"thead")(264,"tr")(265,"th"),e.OEk(266,"Property"),e.C$Y(),e.I0R(267,"th"),e.OEk(268,"Description"),e.C$Y(),e.I0R(269,"th"),e.OEk(270,"Type"),e.C$Y(),e.I0R(271,"th"),e.OEk(272,"Default"),e.C$Y()()(),e.I0R(273,"tbody")(274,"tr")(275,"td"),e.OEk(276,"src"),e.C$Y(),e.I0R(277,"td"),e.OEk(278,"src"),e.C$Y(),e.I0R(279,"td")(280,"code"),e.OEk(281,"string"),e.C$Y()(),e.I0R(282,"td"),e.OEk(283,"-"),e.C$Y()(),e.I0R(284,"tr")(285,"td"),e.OEk(286,"alt"),e.C$Y(),e.I0R(287,"td"),e.OEk(288,"alt"),e.C$Y(),e.I0R(289,"td")(290,"code"),e.OEk(291,"string"),e.C$Y()(),e.I0R(292,"td"),e.OEk(293,"-"),e.C$Y()(),e.I0R(294,"tr")(295,"td"),e.OEk(296,"width"),e.C$Y(),e.I0R(297,"td"),e.OEk(298,"width"),e.C$Y(),e.I0R(299,"td")(300,"code"),e.OEk(301,"string"),e.C$Y()(),e.I0R(302,"td"),e.OEk(303,"-"),e.C$Y()(),e.I0R(304,"tr")(305,"td"),e.OEk(306,"height"),e.C$Y(),e.I0R(307,"td"),e.OEk(308,"height"),e.C$Y(),e.I0R(309,"td")(310,"code"),e.OEk(311,"string"),e.C$Y()(),e.I0R(312,"td"),e.OEk(313,"-"),e.C$Y()()()(),e.I0R(314,"h3",46)(315,"span"),e.OEk(316,"NzImagePreviewOptions"),e.C$Y(),e.I0R(317,"a",47),e.OEk(318,"#"),e.C$Y()(),e.I0R(319,"table")(320,"thead")(321,"tr")(322,"th"),e.OEk(323,"Property"),e.C$Y(),e.I0R(324,"th"),e.OEk(325,"Description"),e.C$Y(),e.I0R(326,"th"),e.OEk(327,"Type"),e.C$Y(),e.I0R(328,"th"),e.OEk(329,"Default"),e.C$Y()()(),e.I0R(330,"tbody")(331,"tr")(332,"td"),e.OEk(333,"nzKeyboard"),e.C$Y(),e.I0R(334,"td"),e.OEk(335,"Whether support press "),e.I0R(336,"code"),e.OEk(337,"esc"),e.C$Y(),e.OEk(338," to close, press "),e.I0R(339,"code"),e.OEk(340,"left"),e.C$Y(),e.OEk(341," or "),e.I0R(342,"code"),e.OEk(343,"right"),e.C$Y(),e.OEk(344," to switch image"),e.C$Y(),e.I0R(345,"td")(346,"code"),e.OEk(347,"boolean"),e.C$Y()(),e.I0R(348,"td")(349,"code"),e.OEk(350,"true"),e.C$Y()()(),e.I0R(351,"tr")(352,"td"),e.OEk(353,"nzMaskClosable"),e.C$Y(),e.I0R(354,"td"),e.OEk(355,"Whether to close the image preview when the mask (area outside the image) is clicked"),e.C$Y(),e.I0R(356,"td")(357,"code"),e.OEk(358,"boolean"),e.C$Y()(),e.I0R(359,"td")(360,"code"),e.OEk(361,"true"),e.C$Y()()(),e.I0R(362,"tr")(363,"td"),e.OEk(364,"nzCloseOnNavigation"),e.C$Y(),e.I0R(365,"td"),e.OEk(366,"Whether to close the image preview when the user goes backwards/forwards in history. Note that this usually doesn't include clicking on links (unless the user is using the HashLocationStrategy)."),e.C$Y(),e.I0R(367,"td")(368,"code"),e.OEk(369,"boolean"),e.C$Y()(),e.I0R(370,"td")(371,"code"),e.OEk(372,"true"),e.C$Y()()(),e.I0R(373,"tr")(374,"td"),e.OEk(375,"nzZIndex"),e.C$Y(),e.I0R(376,"td"),e.OEk(377,"The z-index of the image preview"),e.C$Y(),e.I0R(378,"td")(379,"code"),e.OEk(380,"number"),e.C$Y()(),e.I0R(381,"td"),e.OEk(382,"1000"),e.C$Y()(),e.I0R(383,"tr")(384,"td"),e.OEk(385,"nzZoom"),e.C$Y(),e.I0R(386,"td"),e.OEk(387,"Zoom rate"),e.C$Y(),e.I0R(388,"td")(389,"code"),e.OEk(390,"number"),e.C$Y()(),e.I0R(391,"td"),e.OEk(392,"1"),e.C$Y()(),e.I0R(393,"tr")(394,"td"),e.OEk(395,"nzRotate"),e.C$Y(),e.I0R(396,"td"),e.OEk(397,"Rotate rate"),e.C$Y(),e.I0R(398,"td")(399,"code"),e.OEk(400,"number"),e.C$Y()(),e.I0R(401,"td"),e.OEk(402,"0"),e.C$Y()(),e.I0R(403,"tr")(404,"td"),e.OEk(405,"nzScaleStep"),e.C$Y(),e.I0R(406,"td")(407,"code"),e.OEk(408,"1 + nzScaleStep"),e.C$Y(),e.OEk(409," is the step to increase or decrease the scale"),e.C$Y(),e.I0R(410,"td")(411,"code"),e.OEk(412,"number"),e.C$Y()(),e.I0R(413,"td"),e.OEk(414,"0.5"),e.C$Y()(),e.I0R(415,"tr")(416,"td"),e.OEk(417,"nzFlipHorizontally"),e.C$Y(),e.I0R(418,"td"),e.OEk(419,"Fl

1ip image on horizontal vector"),e.C$Y(),e.I0R(420,"td")(421,"code"),e.OEk(422,"boolean"),e.C$Y()(),e.I0R(423,"td")(424,"code"),e.OEk(425,"false"),e.C$Y()()(),e.I0R(426,"tr")(427,"td"),e.OEk(428,"nzFlipVertically"),e.C$Y(),e.I0R(429,"td"),e.OEk(430,"Flip image on vertical vector"),e.C$Y(),e.I0R(431,"td")(432,"code"),e.OEk(433,"boolean"),e.C$Y()(),e.I0R(434,"td")(435,"code"),e.OEk(436,"false"),e.C$Y()()()()(),e.I0R(437,"h3",48)(438,"span"),e.OEk(439,"NzImagePreviewRef"),e.C$Y(),e.I0R(440,"a",49),e.OEk(441,"#"),e.C$Y()(),e.I0R(442,"table")(443,"thead")(444,"tr")(445,"th"),e.OEk(446,"Name"),e.C$Y(),e.I0R(447,"th"),e.OEk(448,"Description"),e.C$Y()()(),e.I0R(449,"tbody")(450,"tr")(451,"td"),e.OEk(452,"switchTo(index: number): void"),e.C$Y(),e.I0R(453,"td"),e.OEk(454,"Switch to index"),e.C$Y()(),e.I0R(455,"tr")(456,"td"),e.OEk(457,"prev(): void"),e.C$Y(),e.I0R(458,"td"),e.OEk(459,"Previous image"),e.C$Y()(),e.I0R(460,"tr")(461,"td"),e.OEk(462,"next(): void"),e.C$Y(),e.I0R(463,"td"),e.OEk(464,"Next image"),e.C$Y()(),e.I0R(465,"tr")(466,"td"),e.OEk(467,"close(): void"),e.C$Y(),e.I0R(468,"td"),e.OEk(469,"Close image preview"),e.C$Y()()()(),e.I0R(470,"h3",50)(471,"span"),e.OEk(472,"NzImageGroupComponent"),e.C$Y(),e.I0R(473,"label",36),e.OEk(474,"standalone"),e.C$Y(),e.I0R(475,"a",51),e.OEk(476,"#"),e.C$Y()(),e.I0R(477,"table")(478,"thead")(479,"tr")(480,"th"),e.OEk(481,"Property"),e.C$Y(),e.I0R(482,"th"),e.OEk(483,"Description"),e.C$Y(),e.I0R(484,"th"),e.OEk(485,"Type"),e.C$Y(),e.I0R(486,"th"),e.OEk(487,"Default"),e.C$Y()()(),e.I0R(488,"tbody")(489,"tr")(490,"td"),e.OEk(491,"nzScaleStep"),e.C$Y(),e.I0R(492,"td"),e.OEk(493,"The value of "),e.I0R(494,"code"),e.OEk(495,"nzScaleStep"),e.C$Y(),e.OEk(496," will be applied to all the images inside, unless an image has its own "),e.I0R(497,"code"),e.OEk(498,"nzScaleStep"),e.C$Y(),e.OEk(499," value specified."),e.C$Y(),e.I0R(500,"td")(501,"code"),e.OEk(502,"number"),e.C$Y()(),e.I0R(503,"td"),e.OEk(504,"-"),e.C$Y()()()(),e.eAF(),e.C$Y()()),2&t&&(e.yG2(),e.E7m("nzOffsetTop",16),e.yG2(),e.E7m("nzAffix",!1),e.yG2(50),e.E7m("nzGutter",16),e.yG2(),e.E7m("nzXl",12)("nzSpan",24),e.yG2(),e.E7m("nzId","components-image-demo-basic")("nzLink","components-image-demo-basic")("nzIframeHeight",null)("nzHref","https://github.com/NG-ZORRO/ng-zorro-antd/edit/master/components/image/demo/basic.md"),e.yG2(5),e.E7m("nzId","components-image-demo-placeholder")("nzLink","components-image-demo-placeholder")("nzIframeHeight",null)("nzHref","https://github.com/NG-ZORRO/ng-zorro-antd/edit/master/components/image/demo/placeholder.md"),e.yG2(5),e.E7m("nzId","components-image-demo-service")("nzLink","components-image-demo-service")("nzIframeHeight",null)("nzHref","https://github.com/NG-ZORRO/ng-zorro-antd/edit/master/components/image/demo/service.md"),e.yG2(11),e.E7m("nzXl",12)("nzSpan",24),e.yG2(),e.E7m("nzId","components-image-demo-fallback")("nzLink","components-image-demo-fallback")("nzIframeHeight",null)("nzHref","https://github.com/NG-ZORRO/ng-zorro-antd/edit/master/components/image/demo/fallback.md"),e.yG2(5),e.E7m("nzId","components-image-demo-preview-group")("nzLink","components-image-demo-preview-group")("nzIframeHeight",null)("nzHref","https://github.com/NG-ZORRO/ng-zorro-antd/edit/master/components/image/demo/preview-group.md"),e.yG2(5),e.E7m("nzId","components-image-demo-controlled-preview")("nzLink","components-image-demo-controlled-preview")("nzIframeHeight",null)("nzHref","https://github.com/NG-ZORRO/ng-zorro-antd/edit/master/components/image/demo/controlled-preview.md"))},dependencies:[l.A,E.s9,E.mK,k.g,s.QD,s.ox,p.qG,R.If,m.k,h,Y,$,A,f,F],encapsulation:2})}return n})(),N=(()=>{class n{static#e=this.\u0275fac=function(t){return new(t||n)};static#n=this.\u0275mod=e.a4G({type:n});static#t=this.\u0275inj=e.s3X({imports:[w.K,b,v.qQ.forChild([{path:"en",component:S},{path:"zh",component:y}])]})}return n})()}}]);