0.0.6 • Published 4 years ago

mz-file-upload v0.0.6

Weekly downloads
25
License
-
Repository
-
Last release
4 years ago

##Описание Библиотека для ангуляра, для организации загрузки файла

Установка

import {BrowserModule} from '@angular/platform-browser';
import {NgModule} from '@angular/core';
import {AppComponent} from './app.component';
import {MzFileUploadModule} from "mz-file-upload";

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    /*
    подключаем тут наш модуль
    */
    MzFileUploadModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule {}

Пример

<!-- Даем кнопке функционал загрузки файлов -->
<div class="class2">
  <i mzFileInput
     (mzFileUpload)="fileChange($event)"
     [mzFileId]="123">
    ЗАГРУЗИТЬ ФАЙЛ
  </i>
</div>

<!-- Даем кнопке функционал загрузки через перетакскивание -->
<div class="drop-zone"
     mzFileDrop
     [mzFileId]="123"
     (mzFileHovered)="changeStateFileDrop($event)">
  {{fileDrop ? 'HOVER' : 'NOT'}}
</div>


<div class="drop-zone d2"
     mzFileDrop
     [mzFileId]="123"
     (mzFileHovered)="fileDrop2 = $event">
  <div *ngIf="fileDrop2" class="d2Block"></div>
</div>
import {Component, OnInit} from '@angular/core';
import {MzFileUploadService} from "mz-file-upload";;

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit{
  title = 'my-app';
  fileDrop = false;
  fileDrop2 = false;

  constructor (
   private mzFileUpload: MzFileUploadService
  )
  {
  }

  ngOnInit(): void {

    /** обновление статуса */
    this.mzFileUpload.updateStateOfView(
      {
        id: 1235
      },
      false
    );

    /** получение файлов поссле загрузки */
    this.mzFileUpload.getFile(
      {
        id: 123
      }
    ).subscribe(
      (event) => {
        console.log(
          'mzFileUpload - getFile',
          event
        );
      }
    )
  }

  public fileChange (event) {
    console.log(
      'fileChange',
      event
    );
  }

  public changeStateFileDrop (event) {
    console.log(
      'changeStateFileDrop',
      event
    );
    this.fileDrop = event;
  }
}
0.0.6

4 years ago

0.0.5

5 years ago

0.0.4

5 years ago

0.0.3

5 years ago

0.0.2

5 years ago

0.0.1

5 years ago