raonkupload-angular/samples/basic/src/app/demo-form/demo-form.component.html

Angular component for RAON K Upload.

<h2>Integration with forms (<code>ngModel</code>)</h2>

<form (ngSubmit)="onSubmit()" #demoForm="ngForm">
	<h3>User profile form</h3>

	<div>
		<label for="name">Name</label>
		<input [(ngModel)]="model.name" type="text" name="name" id="name">
	</div>

	<div>
		<label for="surname">Surname</label>
		<input [(ngModel)]="model.surname" type="text" name="surname" id="surname">
	</div>

	<label for="raonkupload_form_resume">Resume</label>
	<RaonkUpload
		[(ngModel)]="model.raonkupload_form_resume"
		name="raonkupload_form_resume"

		id="raonkupload_form_resume"
		runtimes="html5"
		componentUrl="/assets/raonkupload/js/raonkupload.js"
		[config]="{ MaxTotalFileSize: '100MB', MaxOneFileSize: '10MB', Width: '100%', Height: '150px', DevelopLangage:'NONE' }"

		(namespaceLoaded)="onNamespaceLoaded( $event )"
		(creationComplete)="onCreationComplete( $event )"
		(beforeAddFile)="onBeforeAddFile( $event )"
		(namespaceLoaded)="onNamespaceLoaded( $event )"
		(creationComplete)="onCreationComplete( $event )"
		(beforeAddFile)="onBeforeAddFile( $event )"
		(afterAddFile)="onAfterAddFile( $event )"
		(afterAddAllFile)="onAfterAddAllFile( $event )"
		(beforeDeleteFile)="onBeforeDeleteFile( $event )"
		(afterDeleteFile)="onAfterDeleteFile( $event )"
		(deleteAllFile)="onDeleteAllFile( $event )"
		(beforeUpload)="onBeforeUpload( $event )"
		(uploadComplete)="onUploadComplete( $event )"
		(beforeDownloadFile)="onBeforeDownloadFile( $event )"
		(beforeOpenFile)="onBeforeOpenFile( $event )"
		(downloadCompleteFile)="onDownloadCompleteFile( $event )"
		(downloadCompleteAllFile)="onDownloadCompleteAllFile( $event )"
		(onError)="onOnError( $event )"
		(downloadCancel)="onDownloadCancel( $event )"
		(selectItem)="onSelectItem( $event )"
		(customAction)="onCustomAction( $event )"
		(alert)="onAlert( $event )"
	></RaonkUpload>

	<p *ngIf="raonkupload_form_resume && raonkupload_form_resume.dirty" class="alert">Resume is "dirty".</p>
	<p *ngIf="raonkupload_form_resume && raonkupload_form_resume.touched" class="alert">Resume has been "touched".</p>

	<p>
		<button type="reset" (click)="reset()">Reset form</button>
	</p>
	<p>
		<button type="submit">Submit this form</button>
		<em>(Open the console first)</em></p>
</form>

<h3>Form data preview</h3>
<pre>{{ formDataPreview }}</pre>