search

coreui / coreui-angular

CoreUI Components Library for Angular https://coreui.io/angular/docs/
https://coreui.io/angular/
MIT License
248 stars 146 forks source link

Issue with importing LayoutModule #133

Closed miniminivan closed 2 years ago

miniminivan commented 2 years ago

Hello! I am facing an issue with my build and came across this error: error NG8002: Can't bind to 'appHtmlAttr' since it isn't a known property of 'a'. 10 [appHtmlAttr]="item.attributes">

So I imported the LayoutModule in my app.module.ts file and now I am facing this error: Error: Module not found: Error: Can't resolve '@coreui/angular/lib/shared'

which fails to compile. Any help is appreciated!

I am using "@coreui/angular": "^2.9.4"

xidedix commented 2 years ago

@miniminivan - coreui v2.9.4 for Angular 9 still works albeit it is deprecated - we cannot reproduce your issue

appHtmlAttr directive is used internally by AppSidebarModule and AppHeaderModule (there is no public export of LayoutModule)

also:

miniminivan commented 2 years ago

@xidedix interesting, I have both of those modules imported in my app.module.ts. This issue with the build only came up last week, and the code that is triggering the error has not changed, so I am not sure what has happened.

my Angular version is: "@angular/core": "^12.2.10" and the actual version of @coreui/angular is: "2.11.2"

xidedix commented 2 years ago

@miniminivan that's weird.

Quick build and run test here for Angular 12, node 16.x, npm 8.x, typescript 4.3.5 and @coreui/angular

Any changes in navItems btw? What about removing node_modules directory and package-lock.json file, then npm install from scratch? Also: we recommend to use v2.12 or v2.13 for Angular 12 and 13 (Ivy).

miniminivan commented 2 years ago

@xidedix I tried installing from scratch with the updated coreui versions and still get the same issue. I don't believe navItems is being changed within the files relating to this component.

Edit: Update, I removed the brackets and did appHtmlAttr="item.attributes" and it compiles, but I am not sure why/if it does the same thing. (I am new to Angular)

xidedix commented 2 years ago

Omitting the brackets renders the string item.attributes, not the value of item.attributes. see: https://angular.io/guide/property-binding

The brackets, [], cause Angular to evaluate the right-hand side of the assignment as a dynamic expression. Without the brackets, Angular treats the right-hand side as a string literal and sets the property to that static value.

miniminivan commented 2 years ago

Was able to build after going back to 2.9.4, will close issue thank you for all your help!