将自定义svg添加到mdi.svg

时间:2019-05-20 05:51:10

标签: angular svg

Adding custom svg icons Angular不再起作用,所以我需要知道如何执行此操作->

我有我的mdi.svg,其中包含很多svg,我在我的app.module中添加了MatIconModule,并且

iconRegistry.addSvgIconSet(sanitizer.bypassSecurityTrustResourceUrl('/assets/icons/mdi.svg')); 

我想在mdi.svg文件中添加一些SVG,所以我只复制了

<g id="account-card-details">
  <path d="M2,3H22C23.05,3 24,3.95 24,5V19C24,20.05 23.05,21 22,21H2C0.95,21 0,20.05 0,19V5C0,3.95 0.95,3 2,3M14,6V7H22V6H14M14,8V9H21.5L22,9V8H14M14,10V11H21V10H14M8,13.91C6,13.91 2,15 2,17V18H14V17C14,15 10,13.91 8,13.91M8,6A3,3 0 0,0 5,9A3,3 0 0,0 8,12A3,3 0 0,0 11,9A3,3 0 0,0 8,6Z" />
</g>
<g id="two-d">
  <path d="M450.232215 541.334095c2.7793-2.158153 5.802146-4.319375 9.070586-6.480598 3.26844-2.159176 6.537903-4.435009 9.806343-6.822382 3.26844-2.387373 6.427386-4.945639 9.478885-7.674796 3.048429-2.728134 5.77247-5.714142 8.1711-8.953929 2.39556-3.240811 4.303003-6.792707 5.720282-10.659781 1.415232-3.865028 2.125407-8.18645 2.125407-12.96222 0-3.865028-0.599657-7.930623-1.797949-12.19474-1.200338-4.264117-3.242857-8.213056-6.128581-11.852956-2.88777-3.637854-6.675026-6.65149-11.357675-9.038864-4.685719-2.387373-10.515494-3.581572-17.48728-3.581572-6.429433 0-12.06785 1.167592-16.914228 3.496637-4.849448 2.331092-8.963139 5.542226-12.339026 9.635451-3.377934 4.093225-5.91164 8.953929-7.599072 14.582113-1.690502 5.628184-2.532683 11.741415-2.532683 18.333554l18.630313 0c0.107447-4.204765 0.515746-8.127098 1.225921-11.768021 0.708128-3.637854 1.797949-6.792707 3.26844-9.466606 1.470491-2.669806 3.432169-4.77577 5.882987-6.309706 2.451842-1.534959 5.528923-2.303462 9.234315-2.303462 4.02978 0 7.29822 0.711198 9.806343 2.131547 2.505054 1.423419 4.465708 3.185552 5.882987 5.287423 1.414209 2.104941 2.368954 4.378727 2.860141 6.822382 0.490164 2.446725 0.734734 4.749164 0.734734 6.907317-0.109494 4.66423-1.25355 8.783037-3.431146 12.365632-2.181689 3.581572-4.959965 6.907317-8.335852 9.977235-3.377934 3.069919-7.083326 5.943362-11.113105 8.613168-4.03285 2.672876-7.900947 5.430686-11.604292 8.271384-7.737218 5.458315-13.83817 11.882632-18.303878 19.271926-4.467755 7.392364-6.756891 16.031115-6.863315 25.923416l78.119195 0 0-17.396205-55.729256 0c0.76134-2.614547 2.177596-5.087878 4.248767-7.41897C445.027679 545.742499 447.453938 543.495318 450.232215 541.334095zM651.169643 372.830357l-278.339286 0c-19.21462 0-34.792411 15.57779-34.792411 34.792411l0 208.754464c0 19.21462 15.57779 34.792411 34.792411 34.792411l278.339286 0c19.21462 0 34.792411-15.57779 34.792411-34.792411l0-208.754464C685.962054 388.408147 670.384263 372.830357 651.169643 372.830357zM668.565848 607.67913c0 14.412244-11.682064 26.094308-26.094308 26.094308l-260.943081 0c-14.412244 0-26.094308-11.682064-26.094308-26.094308l0-191.358259c0-14.412244 11.682064-26.094308 26.094308-26.094308l260.943081 0c14.412244 0 26.094308 11.682064 26.094308 26.094308L668.565848 607.67913zM595.934644 468.935182c-3.969405-5.513574-9.082866-9.862625-15.346523-13.047154-6.263657-3.181459-13.676487-4.77577-22.23542-4.77577l-46.352701 0 0 121.773438 46.352701 0c8.558933 0 15.972786-1.591241 22.23542-4.77577 6.264681-3.181459 11.378142-7.53051 15.346523-13.047154 3.965312-5.513574 6.91448-11.965519 8.846482-19.357883 1.930979-7.390317 2.89698-15.291265 2.89698-23.706935 0-8.4126-0.966001-16.314571-2.89698-23.706935C602.849124 480.903771 599.899956 474.451826 595.934644 468.935182zM586.617441 529.140379c-0.99363 5.2864-2.873444 9.891278-5.638417 13.814634-2.76702 3.922333-6.576789 6.992251-11.431354 9.209756-4.854565 2.217505-11.093662 3.325745-18.7132 3.325745l-19.260669 0 0-86.981027 19.260669 0c7.619538 0 13.858636 1.109264 18.7132 3.325745 4.854565 2.217505 8.664334 5.2864 11.431354 9.209756 2.764973 3.922333 4.644787 8.527211 5.638417 13.814634 0.99056 5.287423 1.486864 11.000542 1.486864 17.140379S587.608002 523.852956 586.617441 529.140379z" />
</g>
<g id="three-d">
  <path d="M651.169643 372.830357l-278.339286 0c-19.21462 0-34.792411 15.57779-34.792411 34.792411l0 208.754464c0 19.21462 15.57779 34.792411 34.792411 34.792411l278.339286 0c19.21462 0 34.792411-15.57779 34.792411-34.792411l0-208.754464C685.962054 388.408147 670.384263 372.830357 651.169643 372.830357zM668.565848 607.67913c0 14.412244-11.682064 26.094308-26.094308 26.094308l-260.943081 0c-14.412244 0-26.094308-11.682064-26.094308-26.094308l0-191.358259c0-14.412244 11.682064-26.094308 26.094308-26.094308l260.943081 0c14.412244 0 26.094308 11.682064 26.094308 26.094308L668.565848 607.67913zM474.478432 507.817748l0-0.333598c5.38873-2.007727 9.349949-5.211698 11.884678-9.618055 2.535753-4.40431 3.803629-9.56075 3.803629-15.47239 0-5.128811-1.00591-9.673313-3.01159-13.633508-2.007727-3.957125-4.674463-7.218402-8.002254-9.784854-3.327792-2.563382-7.079232-4.51585-11.251252-5.854335-4.175089-1.338485-8.426927-2.007727-12.756535-2.007727-5.601578 0-10.617825 1.003863-15.054881 3.01159-4.437056 2.006703-8.215102 4.795213-11.330046 8.363482-3.116991 3.569292-5.573949 7.77815-7.368828 12.628622-1.797949 4.850471-2.800789 10.120498-3.01159 15.807011l18.065448 0c-0.107447-3.010567 0.210801-5.938246 0.950651-8.782014 0.737804-2.843768 1.874697-5.40715 3.406586-7.694239 1.529843-2.284019 3.458775-4.098341 5.78475-5.435803 2.321882-1.338485 5.071506-2.007727 8.239662-2.007727 5.071506 0 9.216919 1.505283 12.440333 4.516874 3.221368 3.010567 4.833075 7.024997 4.833075 12.043291 0 3.569292-0.713244 6.580882-2.139733 9.031701-1.426489 2.454912-3.302209 4.377704-5.626137 5.771447-2.324952 1.394766-4.967128 2.369977-7.92346 2.926656-2.959402 0.559748-5.91778 0.781806-8.874111 0.669242l0 14.217816c3.589758-0.110517 7.103792 0 10.538007 0.333598 3.432169 0.334621 6.52153 1.200338 9.270131 2.593058 2.745531 1.39579 4.965082 3.429099 6.655584 6.105045 1.688455 2.675946 2.535753 6.30152 2.535753 10.872628 0 6.691399-2.035356 11.849886-6.100952 15.473413-4.067642 3.624551-9.112542 5.435803-15.133675 5.435803-7.079232 0-12.388145-2.368954-15.925714-7.108908-3.540639-4.738931-5.204535-10.677177-4.991688-17.814738l-18.065448 0c0.104377 6.133697 1.00284 11.70867 2.693342 16.726963 1.689479 5.018294 4.14439 9.312086 7.368828 12.879332 3.221368 3.570315 7.234775 6.330172 12.043291 8.280594 4.805446 1.949398 10.431583 2.926656 16.877389 2.926656 5.281283 0 10.3006-0.837064 15.054881-2.509147 4.753257-1.673106 8.9263-4.040013 12.518105-7.108908 3.590781-3.064802 6.442736-6.79987 8.556886-11.206226 2.112104-4.40431 3.169179-9.393951 3.169179-14.97097 0-7.581676-1.77032-14.022365-5.308913-19.318998C485.754243 512.475837 480.817814 509.156232 474.478432 507.817748zM595.934644 468.935182c-3.969405-5.513574-9.082866-9.862625-15.346523-13.047154-6.263657-3.181459-13.676487-4.77577-22.23542-4.77577l-46.352701 0 0 121.773438 46.352701 0c8.558933 0 15.972786-1.591241 22.23542-4.77577 6.264681-3.181459 11.378142-7.53051 15.346523-13.047154 3.965312-5.513574 6.91448-11.965519 8.846482-19.357883 1.930979-7.390317 2.89698-15.291265 2.89698-23.706935 0-8.4126-0.966001-16.314571-2.89698-23.706935C602.849124 480.903771 599.899956 474.451826 595.934644 468.935182zM586.617441 529.140379c-0.99363 5.2864-2.873444 9.891278-5.638417 13.814634-2.76702 3.922333-6.576789 6.992251-11.431354 9.209756-4.854565 2.217505-11.093662 3.325745-18.7132 3.325745l-19.260669 0 0-86.981027 19.260669 0c7.619538 0 13.858636 1.109264 18.7132 3.325745 4.854565 2.217505 8.664334 5.2864 11.431354 9.209756 2.764973 3.922333 4.644787 8.527211 5.638417 13.814634 0.99056 5.287423 1.486864 11.000542 1.486864 17.140379S587.608002 523.852956 586.617441 529.140379z" />
</g>
<g id="account-check">
  <path d="M9,5A3.5,3.5 0 0,1 12.5,8.5A3.5,3.5 0 0,1 9,12A3.5,3.5 0 0,1 5.5,8.5A3.5,3.5 0 0,1 9,5M9,13.75C12.87,13.75 16,15.32 16,17.25V19H2V17.25C2,15.32 5.13,13.75 9,13.75M17,12.66L14.25,9.66L15.41,8.5L17,10.09L20.59,6.5L21.75,7.91L17,12.66Z" />
</g>

我添加的两个svg tho(两维和三维)不起作用,什么也没有出现,如果我称“本地” svg(如帐户检查),则确实使用

出现
<mat-icon svgIcon="two-d"></mat-icon>

怎么了?

0 个答案:

没有答案