Fix for asset url.

src/Squidex/app/framework/angular/forms/autocomplete.component.html

@@ -6,7 +6,7 @@
         autocapitalize="off">
 
     <ng-container *sqxModal="snapshot.suggestedItems.length > 0" position="bottom-left">
-        <div class="control-dropdown" [sqxAnchoredTo]="input" positition="bottom-left" #container @fade>
+        <div class="control-dropdown" [sqxAnchoredTo]="input" position="bottom-left" #container @fade>
             <div *ngFor="let item of snapshot.suggestedItems; let i = index" class="control-dropdown-item control-dropdown-item-selectable"
                 [class.active]="i === snapshot.suggestedIndex"
                 [container]="container"

src/Squidex/app/shared/components/markdown-editor.component.ts

@@ -9,6 +9,7 @@ import { AfterViewInit, ChangeDetectionStrategy, ChangeDetectorRef, Component, E
 import { NG_VALUE_ACCESSOR } from '@angular/forms';
 
 import {
+    ApiUrlConfig,
     AssetDto,
     AssetUploaderState,
     DialogModel,
@@ -52,6 +53,7 @@ export class MarkdownEditorComponent extends StatefulControlComponent<State, str
     public assetsDialog = new DialogModel();
 
     constructor(changeDetector: ChangeDetectorRef,
+        private readonly apiUrl: ApiUrlConfig,
         private readonly assetUploader: AssetUploaderState,
         private readonly renderer: Renderer2,
         private readonly resourceLoader: ResourceLoaderService
@@ -205,7 +207,7 @@ export class MarkdownEditorComponent extends StatefulControlComponent<State, str
         let content = '';
 
         for (let asset of assets) {
-            content += `![${asset.fileName}](${asset.contentUrl} '${asset.fileName}')`;
+            content += `![${asset.fileName}](${asset.fullUrl(this.apiUrl)} '${asset.fileName}')`;
         }
 
         if (content.length > 0) {
@@ -252,7 +254,7 @@ export class MarkdownEditorComponent extends StatefulControlComponent<State, str
         this.assetUploader.uploadFile(file)
             .subscribe(asset => {
                 if (Types.is(asset, AssetDto)) {
-                    replaceText(`![${asset.fileName}](${asset.contentUrl} '${asset.fileName}')`);
+                    replaceText(`![${asset.fileName}](${asset.fullUrl(this.apiUrl)} '${asset.fileName}')`);
                 }
             }, error => {
                 if (!Types.is(error, UploadCanceled)) {

src/Squidex/app/shared/components/pipes.ts

@@ -216,8 +216,13 @@ export class UserPictureRefPipe extends UserAsyncPipe implements PipeTransform {
     pure: true
 })
 export class AssetUrlPipe implements PipeTransform {
+    constructor(
+        private readonly apiUrl: ApiUrlConfig
+    ) {
+    }
+
     public transform(asset: AssetDto): string {
-        return `${asset.contentUrl}&sq=${MathHelper.guid()}`;
+        return `${asset.fullUrl(this.apiUrl)}&sq=${MathHelper.guid()}`;
     }
 }
 
@@ -226,8 +231,13 @@ export class AssetUrlPipe implements PipeTransform {
     pure: true
 })
 export class AssetPreviewUrlPipe implements PipeTransform {
+    constructor(
+        private readonly apiUrl: ApiUrlConfig
+    ) {
+    }
+
     public transform(asset: AssetDto): string {
-        return asset.contentUrl;
+        return asset.fullUrl(this.apiUrl);
     }
 }
 

src/Squidex/app/shared/components/rich-editor.component.ts

@@ -11,6 +11,7 @@ import { AfterViewInit, ChangeDetectionStrategy, ChangeDetectorRef, Component, E
 import { NG_VALUE_ACCESSOR } from '@angular/forms';
 
 import {
+    ApiUrlConfig,
     AssetDto,
     AssetUploaderState,
     DialogModel,
@@ -55,6 +56,7 @@ export class RichEditorComponent extends StatefulControlComponent<undefined, str
     public assetsDialog = new DialogModel();
 
     constructor(changeDetector: ChangeDetectorRef,
+        private readonly apiUrl: ApiUrlConfig,
         private readonly assetUploader: AssetUploaderState,
         private readonly resourceLoader: ResourceLoaderService
     ) {
@@ -102,7 +104,7 @@ export class RichEditorComponent extends StatefulControlComponent<undefined, str
                 this.assetUploader.uploadFile(file)
                     .subscribe(asset => {
                         if (Types.is(asset, AssetDto)) {
-                            success(asset.contentUrl);
+                            success(asset.fullUrl(this.apiUrl));
                         }
                     }, error => {
                         if (!Types.is(error, UploadCanceled)) {
@@ -190,7 +192,7 @@ export class RichEditorComponent extends StatefulControlComponent<undefined, str
         let content = '';
 
         for (let asset of assets) {
-            content += `<img src="${asset.contentUrl}" alt="${asset.fileName}" />`;
+            content += `<img src="${asset.fullUrl(this.apiUrl)}" alt="${asset.fileName}" />`;
         }
 
         if (content.length > 0) {
@@ -220,7 +222,7 @@ export class RichEditorComponent extends StatefulControlComponent<undefined, str
         this.assetUploader.uploadFile(file)
             .subscribe(asset => {
                 if (Types.is(asset, AssetDto)) {
-                    replaceText(`<img src="${asset.contentUrl}" alt="${asset.fileName}" />`);
+                    replaceText(`<img src="${asset.fullUrl(this.apiUrl)}" alt="${asset.fileName}" />`);
                 }
             }, error => {
                 if (!Types.is(error, UploadCanceled)) {

src/Squidex/app/shared/services/assets.service.ts

@@ -80,6 +80,10 @@ export class AssetDto {
 
         this._meta = meta;
     }
+
+    public fullUrl(apiUrl: ApiUrlConfig) {
+        return apiUrl.buildUrl(this.contentUrl);
+    }
 }
 
 export interface AnnotateAssetDto {