Kif Tintegra ONLYOFFICE Docs ma' Angular


Angular huwa qafas ta 'żvilupp ta' applikazzjoni front-end b'xejn u open-source bbażat fuq TypeScript użat ħafna għall-bini ta 'applikazzjonijiet mobbli indiġeni u l-ħolqien ta' apps installati fuq id-desktop għal Linux, Windows u macOS.

Jekk tiżviluppa u tħaddem applikazzjonijiet ibbażati fuq Angolari, tista' tkun idea tajba li tippermetti l-editjar tad-dokumenti u l-kollaborazzjoni f'ħin reali fis-servizz tiegħek billi tintegra ONLYOFFICE Docs (ONLYOFFICE Document Server). Tali integrazzjoni hija possibbli minħabba komponent uniku żviluppat għall-qafas Angolari mill-iżviluppaturi ONLYOFFICE.

Meta jkun integrat, il-komponent jippermettilek tinstalla l-edituri onlajn ONLYOFFICE u tittestja l-prestazzjoni tagħhom fl-ambjent Angular tiegħek. Hawnhekk huwa kif tista 'tagħmel dan.

Dwar ONLYOFFICE Docs

Fajls PDF fil-web browser tiegħek.

Is-soluzzjoni hija open source u teħtieġ skjerament fuq il-post fuq server lokali. Pereżempju, jista 'jiġi installat fuq Debian u Ubuntu jew distros oħra bbażati fuq Linux.

ONLYOFFICE Docs joffri interface faċli għall-utent u sett komplut ta' karatteristiċi sabiex tkun tista' faċilment tiftaħ u teditja dokumenti ta' test, spreadsheets, preżentazzjonijiet, u formoli li jistgħu jimtlew ta' kwalunkwe kumplessità. Is-suite hija kompletament kompatibbli mal-fajls Microsoft Word, Excel, u PowerPoint u tappoġġja formati popolari oħra, inkluż ODF.

Tista' tuża s-suite ONLYOFFICE fi ħdan ONLYOFFICE Workspace, pjattaforma open-source għal xogħol kollaborattiv u ġestjoni tat-tim, jew tintegraha ma' app jew pjattaforma oħra bbażata fuq il-web.

Pereżempju, tista 'tintegra ONLYOFFICE Docs ma' Alfresco, Redmine, eċċ. In-numru totali ta 'integrazzjonijiet disponibbli huwa aktar minn 30.

Għal ONLYOFFICE Docs, hemm app desktop b'xejn għall-Windows, Linux, u macOS, li tippermettilek taħdem b'dokumenti offline, u apps mobbli b'xejn għal Android u iOS.

ONLYOFFICE Docs jipprovdi API miftuħa u huwa kompatibbli mal-protokoll WOPI, sabiex l-iżviluppaturi tas-softwer jistgħu faċilment idaħħlu s-suite fl-għodod tas-softwer tagħhom. Għal dan il-għan, hemm verżjoni speċjali msejħa ONLYOFFICE Docs Developer Edition.

Installa Komponent Angolari għal ONLYOFFICE Document Server

L-ewwelnett, jeħtieġ li jkollok ONLYOFFICE Docs (ONLYOFFICE Document Server) installat fuq is-server tiegħek. Tista 'tikseb minn GitHub billi tuża l-istruzzjonijiet ta' installazzjoni korrispondenti.

Il-komponent ONLYOFFICE għall-qafas Angular huwa disponibbli fir-Reġistru npm. Huwa għalhekk li għandek bżonn tinstallah minn npm b'dan il-kmand:

$ npm install --save @onlyoffice/document-editor-angular

L-installazzjoni tal-komponent bl-użu tal-ħajt hija wkoll possibbli. Sempliċement mexxi dan il-kmand:

$ yarn add @onlyoffice/document-editor-angular

Kif tuża Komponent Angolari fid-Dokumenti ONLYOFFICE

Wara l-installazzjoni b'suċċess, għandek bżonn timporta DocumentEditorModule:

import { NgModule } from '@angular/core';
import { DocumentEditorModule } from "@onlyoffice/document-editor-angular";

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    DocumentEditorAngularModule
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }

Wara dan, trid tiddefinixxi l-għażliet li ġejjin fil-komponent tal-konsum tiegħek:

@Component({...})
export class ExampleComponent {
  config: IConfig = {
    document: {
      "fileType": "docx",
      "key": "Khirz6zTPdfd7",
      "title": "Example Document Title.docx",
      "url": "https://example.com/url-to-example-document.docx"
    },
    documentType: "word",
    editorConfig: {
      "callbackUrl": "https://example.com/url-to-callback.ashx"
    },
  }

  onDocumentReady = (event) => {
    console.log("Document is loaded");
  };
}

Il-pass li jmiss huwa li tuża l-komponent tal-editur tad-dokumenti bl-għażliet fil-mudell tiegħek:

<document-editor 
  id="docxForComments" 
  documentServerUrl="http://documentserver/"
  [config]="config"
  [events_onDocumentReady]="onDocumentReady"
></document-editor>

Deskrizzjoni sħiħa tal-għażliet kollha disponibbli hija disponibbli fuq document-editor-angular.

Imbagħad installa d-dipendenzi kollha meħtieġa tal-proġett:

$ npm install

Il-pass li jmiss huwa li tibni l-proġett innifsu:

$ cd ./projects
$ ng build @onlyoffice/document-editor-angular

Oħloq il-pakkett tal-proġett:

$ cd ./dist/onlyoffice/document-editor-angular
$ npm pack

Fl-aħħarnett, ittestja l-komponent ONLYOFFICE:

$ cd ./projects
$ ng test @onlyoffice/document-editor-angular

Dak hu! Issa tista' tara kif jaħdem ONLYOFFICE Docs fl-app Angular tiegħek.