angular-express | angular and express in brunch | Server Side Rendering library

I have a component with HostBinded property that I want to update manually from other components. I wrote it like this:

What code changes can remedy the Error described below ?

Use-case

A drop-down input UI is protected from unintended selected value change via a modal. However, the event (click, focus or other), wired to the drop-down causes the ExpressionChangedAfterItHasBeenCheckedError, observed in Chrome console in dev mode.

Observed result

When drop-down is clicked, an ExpressionChangedAfterItHasBeenCheckedError is thrown (see console)

Expected result

When drop-down is clicked, a Modal opens without error

Demo

A link to demo in stackblitz

Notes

• As described in "Everything you need to know about ExpressionChangedAfterItHasBeenCheckedError" here, I attempt to trigger change detection (see comments inside app.component.ts:48-49, marked as STEP-1 and STEP-2), but unsuccessfully (probably triggered not in the right place?)
• The modal in the demo is not fully implemented for [OK] and [CANCEL] as it doesn't affect the Error
• The code is simplified version of a larger app

In my exploration of Angular, I've found two possible ways to use one module inside of another.

(Using the angular-express-starter project for reference)

• Method 1: Declare it in the imports array. For example

  ...

I'm integrating Adobe Creative SDK WEB to my angularjs website.

I have followed the "Image Editor UI" guide from official Adobe website And also a this example using angularjs:

https:// github.com/CreativeSDK/web-getting-started-samples/tree/master/image-editor-ui/image-editor-ui-angular-express>

In both cases I tried with dynamic and hard coded id and image src.

** This is working **

When I click the "edit" link, editor opens fine and start loading the image.

While loading, the image size is exactly the same as my placeholder size.

Screen capture of my table with image and link https://ibb.co/kZ5ama

** End this is working **

The problem I'm getting is this:

After the photo is loaded, the size shrinks and goes to the top left corner.

Also when I try to draw on top of it, I have to start by clicking inside the small photo and continue as if the size of the photo is the entire screen.

Screen capture of the editor here, look at the end of the red stroke and my cursor position: https://ibb.co/iYJECF

Here is my edit link

after googling for a way to upload a big file using angular 4, i found nothing.

i found this ng-file-upload in this question Upload big files in SPA (angular + express), but it's for angularjs, is there any thing for angular 4 ?