Jak wdrożyć Dokumenty OnlyOffice na Angular

Kątowy to bezpłatny i open source front-end program rozwoju aplikacji powszechnie używany do budowania natywnych aplikacji mobilnych i tworzenia aplikacji instalowanych na komputery dla Linux, Windows i MacOS.

Jeśli opracujesz i uruchamiasz aplikacje oparte na kątach, może być dobrym pomysłem, aby umożliwić edycję dokumentów i współpracę w czasie rzeczywistym w ramach usługi poprzez integrację Dokumenty OnlyOffice (Serwer Dokumentacji OnlyOffice). Taka integracja jest możliwa ze względu na unikalny komponent opracowany dla ramy kątowej przez programistów jedynych.

Po zintegrowaniu komponent umożliwia zainstalowanie OnlyOffice redaktorzy online i sprawdź ich wydajność w środowisku kątowym. Oto jak możesz to zrobić.

O DOCISKI TYLEOFFICE

OnlyOffice Docs to internetowy pakiet biurowy, który umożliwia pracę z dokumentami tekstowymi, arkuszami kalkulacyjnymi, prezentacjami, formularzami wypełniającymi i plikami PDF w przeglądarce internetowej.

Rozwiązaniem jest open source i wymaga wdrożenia lokalnego na serwerze lokalnym. Na przykład można go zainstalować w Debian i Ubuntu lub innych dystrybucjach Linux.

Dokumenty OnlyOffice oferuje przyjazny dla użytkownika interfejs i kompletny zestaw funkcji, dzięki czemu można łatwo otwierać i edytować dokumenty tekstowe, arkusze kalkulacyjne, prezentacje i wypełnione formy złożoności. Pakiet jest całkowicie kompatybilny z plikami Microsoft Word, Excel i PowerPoint i obsługuje inne popularne formaty, w tym ODF.

Możesz użyć OnlyOffice Suite w przestrzeni roboczej OnlyOffice, platformie open source do współpracy i zarządzania zespołem lub zintegruj ją z inną aplikacją lub platformą internetową.

Na przykład możesz zintegrować Dokumenty OnlyOffice z NextCloud, Moodle, Confluence, OwnCloud, WordPress, Seafile, SharePoint, Alfresco, Redmine i tak dalej. Całkowita liczba dostępnych integracji wynosi ponad 30.

Dla Dokumenty OnlyOffice, Istnieje bezpłatna aplikacja do komputerów stacjonarnych dla systemu Windows, Linux i MacOS, która umożliwia pracę z dokumentami offline oraz bezpłatne aplikacje mobilne na Android i iOS.

Dokumenty OnlyOffice zapewnia otwarte API i jest kompatybilny z Wopi Protokół, więc programiści mogą łatwo osadzić pakiet w swoje narzędzia programowe. W tym celu istnieje specjalna wersja o nazwie OnlyOffice Docs Developer Edition.

Zainstaluj komponent kątowy dla serwera dokumentów OnlyOffice

Po pierwsze, musisz mieć Dokumenty OnlyOffice (Serwer Dokumentacji OnlyOffice) Zainstalowane na twoim serwerze. Możesz go uzyskać z GitHub za pomocą odpowiednich instrukcji instalacji.

W rejestrze NPM dostępny jest jedyny element ramy kątowej. Dlatego musisz go zainstalować NPM z tym poleceniem:

$ npm instaluj--save @jedyneffice/Document-Editor-Eangular 

Instalacja komponentu za pomocą przędza jest również możliwe. Po prostu uruchom to polecenie:

$ yarn Dodaj @OnlyOffice/Document-Editor-Agular 

Jak używać komponentu kątowego w Dokumentach OnlyOffice

Po udanej instalacji musisz zaimportować DocumedItormodule:

import ngmodule z „@angular/core”; import DocumentEditormodule z „@OnlyOffice/Document-Editor-Eangular”; @Ngmodule (Deklaracje: [AppComponent], import: [DOUSITITIRANGULARMODULE], Bootstrap: [AppComponent]) klasa eksportowa AppModule  

Następnie musisz zdefiniować następujące opcje w swoim komponencie konsumpcyjnym:

@Component (…) Examport Class Class config: iconfig = Document: „fileType”: „Docx”, „Key”: „Khirz6ztpdfd7”, „tytuł”: „Przykładowy tytuł dokumentu.Docx ",„ URL ”:„ https: // przykład.COM/URL-na przykład Document.Docx ", DocumentType:„ Word ”, editorConfig: " callbackurl ":" https: // przykład.com/url-to-callback.Ashx ", onDocumentReady = (zdarzenie) => konsola.log („Dokument jest załadowany”); ;  

Następnym krokiem jest użycie Editor dokumentu Komponent z opcjami w szablonie:

Pełny opis wszystkich dostępnych opcji jest dostępny w kasach Dokument-Editor.

Dalszy rozwój

Następnie zainstaluj wszystkie wymagane zależności projektu:

$ npm instalacja 

Następnym krokiem jest zbudowanie samego projektu:

$ CD ./Projects $ ng build @OnlyOffice/Document-Editor-Agular 

Utwórz pakiet projektu:

$ CD ./Dist/OnlyOffice/Document-Editor-Echy $ NPM Pack 

Na koniec przetestuj komponent OlfOffice:

$ CD ./Projects $ ng test @OnlyOffice/Document-Editor-Agular 

Otóż ​​to! Teraz możesz zobaczyć, jak Dokumenty OnlyOffice działa w twoim Kątowy App.