Angular

[will-jai]

Hi,

Our application is built using Angular and we are trying to add the iTwin viewer into our application, when we run the viewer we got the below error in the browser console. Could you please advise how we can resolve the issue? thank you

[grigasp]

I think the error you get in console pretty much explains the issue.

By default the viewport component takes 100% of its parent HTML element's size. You can also provide custom size through ViewportProps.style. In any case, width and height must be larger than 0.

[will-jai]

angular-itwin-react.zip
Thanks for your reply, unfortunately, We are not sure how to apply the ViewportProps to the viewer. I have attached a sample Angular app with itwin-viewer. Could you please advise how we can resolve the issue? thanks.

[kckst8]

@will-jai - I downloaded your code but could not get it to run. I get this after ng build/ng serve:

An unhandled exception occurred: Invalid target: {"project":"angular-itwin-react","target":"build"}.

Have you tried adding a height to the container div at this level as well?

private render() { ReactDOM.render(<div><h2>Viewer Angular Wrapper</h2> <ITwinViewerComponent iModelId={this.iModelId} contextId={this.contextId} /> </div>, this.viewerViewEl.nativeElement); }

[kckst8]

@will-jai I was able to get it running. There was a typo in the project name (angaular-itwin-react). It looks as though none of the css classes from the scss files that are used by the Viewer and its dependencies are being added and that is likely causing the issue that you are seeing (among other layout issues). I don't know enough about Angular, but it appears that you may have to add some configuration to the "styles" property in angular.json. It would not be scalable to add each and every scss file here, but perhaps globs are supported? Ideally, you would want all scss and css from any packages with the @bentley scope to be included:

https://angular.io/guide/workspace-config#style-script-config

[aruniverse]

What version of the itwin-viewer are you using?

cc @kckst8

[will-jai]

I am using 6.1.4