Closed devpei closed 5 years ago
重新安装即可解决。
Sorry guys, but can you put your questions/answers in English? I'm using the ng-zorro version 8.1.2 but reinstall do not solve the probem. Do I need to install a specific library for those icons?
In my particular case if I use: <i [nzType].... />
the following error arise:
Can't bind to 'nzType' since it isn't a known property of 'i'
but when I'm using <i nz-icon [nzType].... />
the specific error displayed here appears:
ERROR Error: [@ant-design/icons-angular]: the icon menu-fold-o does not exist or is not registered.
I've extracted that from the documentation page and nothing of above tried seems to work.
@BruneXX Please read the doc https://ng.ant.design/components/icon/en#static-loading-and-dynamic-loading. You need to register icons (import icon resources in another word). The error is quite explicit IMHO.
Hi! @wendzhue thanks! yes, you're right, but I think the documentation should be more explicit with that. I've found different explanations and different code snippets in documentation, github repo and examples. Thank you again for the quick reply.
PR is welcome! @BruneXX
@wendzhue great! I'll glad to help with anything when found the time!
Hi! I received this error when running tests. Icons is dynamically linked under "ant" namespace. Can you help me?
@olegdeezus In test environment, I strongly recommend you to write an IconTestingModule
and provide all icons in that module. And import that module when you are configuraing tests.
You can use this as a reference. https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/components/icon/testing/nz-icon-test.module.ts
Hope this helps.
@wendzhue Thank you!
Hi, Thanks for the answers above, I am Using Angular Universal and I should mention that for my case it seems the error was displayed but the svgs were displayed as HTTP remote calls was loading them. It seems the error showing on the console is therefore a false alarm, since its not aware that they are dynamically loaded. Now its quite strange to wire my mind to ignore the error messages displayed
Hi, Thanks for the answers above, I am Using Angular Universal and I should mention that for my case it seems the error was displayed but the svgs were displayed as HTTP remote calls was loading them. It seems the error showing on the console is therefore a false alarm, since its not aware that they are dynamically loaded. Now its quite strange to wire my mind to ignore the error messages displayed
I'm facing the same issue. Is there any solution to get rid of those ugly error messages on the console?
Hi, Thanks for the answers above, I am Using Angular Universal and I should mention that for my case it seems the error was displayed but the svgs were displayed as HTTP remote calls was loading them. It seems the error showing on the console is therefore a false alarm, since its not aware that they are dynamically loaded. Now its quite strange to wire my mind to ignore the error messages displayed
I am facing the same in Angular Universal.
重新安装即可解决。
Hope you are here to help me?
File : package.json ` "dependencies": {
"@angular/animations": "~10.0.2",
"@angular/common": @ #"~10.0.2",
"@angular/compiler": "~10.0.2",
"@angular/core": "~10.0.2",
"@angular/forms": "~10.0.2",
"@angular/platform-browser": "~10.0.2",
"@angular/platform-browser-dynamic": "~10.0.2",
"@angular/router": "~10.0.2",
"@ant-design/icons": "^4.2.2",
"@ant-design/icons-angular": "^10.0.1",
"ng-zorro-antd": "^10.0.2",
"rxjs": "~6.5.5",
"tslib": "^2.0.0",
"zone.js": "~0.10.3"`
When I want to add an icon :
<i nz-icon nzType="star" nzTheme="fill"></i>
It runs but
<i nz-icon nzType="menu-fold" nzTheme="outline"></i>
Error:
http://localhost:4200/assets/outline/menu-fold.svg 404 (Not Found)
ERROR Error: [@ant-design/icons-angular]:the icon menu-fold-o does not exist or is not registered.
Thanks you
This issue solved with installing @ant-design/icons-angular and add " { "glob": "*/", "input": "node_modules/@ant-design/icons-angular/src/inline-svg/", "output": "/assets/" }" in angualr.json. Thank you
In my particular case if I use:
<i [nzType].... />
the following error arise:
Can't bind to 'nzType' since it isn't a known property of 'i'
but when I'm using
<i nz-icon [nzType].... />
the specific error displayed here appears:
ERROR Error: [@ant-design/icons-angular]: the icon menu-fold-o does not exist or is not registered.
I've extracted that from the documentation page and nothing of above tried seems to work.
Please add import { NzButtonModule } from 'ng-zorro-antd/button'; to app.module and then add NzButtonModule to the list of imports.
That should do the trick.
我也遇到过同样的问题,删除node_modules之后重新下载依赖之后就好了,仅供参考
@wendzhue Thank you
Hi all,
I m facing the same issue when I try to run ng test.
I've tried all the solutions above but I still cannot run ng test without getting many errors saying the following message: ERROR Error: [@ant-design/icons-angular]: the icon arrow-left-o does not exist or is not registered.
My version of ng-zorro-antd is 13.0.0
As wzhudev says above
1:Create a new file . eg: import { NzIconTestModule } from '@shared/nz-icon-test.module';
You can use this as a reference. https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/components/icon/testing/nz-icon-test.module.ts
2: Introduce it in your test file eg: beforeEach(async () => { await TestBed.configureTestingModule({ imports: [ NzIconTestModule //here
now , is OK!
As wzhudev says above
1:Create a new file . eg: import { NzIconTestModule } from '@shared/nz-icon-test.module';
You can use this as a reference. https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/components/icon/testing/nz-icon-test.module.ts
2: Introduce it in your test file eg: beforeEach(async () => { await TestBed.configureTestingModule({ imports: [ NzIconTestModule //here
now , is OK!
Thanks chenweihan.
I already implemented that but nothing has changed.
@dimitriadisat please check it again, because this file is the file in the official test case. https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/components/icon/testing/nz-icon-test.module.ts.
This issue solved with installing @ant-design/icons-angular and add " { "glob": "*/", "input": "node_modules/@ant-design/icons-angular/src/inline-svg/", "output": "/assets/" }" in angualr.json. Thank you
thank you this is working
Reproduction link
https://stackblitz.com/edit/ng-zorro-antd-start?embed=1&file=package.json
Steps to reproduce
根据官网快速上手一步步创建,在使用图标的时候错误。
What is expected?
能够显示图标
What is actually happening?
ERROR Error: [@ant-design/icons-angular]: the icon arrow-left-o does not exist or is not registered.
原因: { "glob": "*/", "input": "./node_modules/@ant-design/icons-angular/src/inline-svg/", "output": "/assets/" } 版本7.3.2install后node_moudle没有/@ant-design/icons-angular/src/inline-svg/目录