Hi I need create plugin for jira server, code is completely written in external angular app. What I want is display whole angular application in jira like plugin. Is it possible to do that ? I have only basic knowligde of java. Any tutorial for that ? Many Thanks.
Hey there,
i created a little guide, to demonstrate how Angular can be integrated into Jira. You can give it a read if you want and you are still interested.
You need a base DOM element on which initialize angular entry component like below.
dynamic.loader.ts
import {Type, ApplicationRef, ComponentFactoryResolver, Component, ComponentRef, Injector, NgZone} from '@angular/core';
export class DynamicNg2Loader {
private appRef: ApplicationRef;
private componentFactoryResolver: ComponentFactoryResolver;
private zone:NgZone;
constructor(private injector:Injector) {
this.appRef = injector.get(ApplicationRef);
this.zone = injector.get(NgZone);
this.componentFactoryResolver = injector.get(ComponentFactoryResolver);
}
loadComponentAtDom<T>(component:Type<T>, dom:Element, onInit?: (Component:T) => void): ComponentRef<T> {
let componentRef;
this.zone.run(() => {
try {
let componentFactory = this.componentFactoryResolver.resolveComponentFactory(component);
componentRef = componentFactory.create(this.injector, [], dom);
onInit && onInit(componentRef.instance);
this.appRef.attachView(componentRef.hostView);
} catch (e) {
console.error("Unable to load component", component, "at", dom);
throw e;
}
});
return componentRef;
}
}
main.ts
import {enableProdMode} from '@angular/core';
import {platformBrowserDynamic} from '@angular/platform-browser-dynamic';
import {AppModule} from './app/app.module';
import {environment} from './environments/environment';
import {AuditComponent} from "./app/audit/audit.component";
import {DynamicNg2Loader} from "./app/dynamic.loader";
import {disableDebugTools} from "@angular/platform-browser";
if (environment.production) {
disableDebugTools();
enableProdMode();
}
platformBrowserDynamic().bootstrapModule(AppModule).then(function (ng2ModulerRef) {
let ng2Loader = new DynamicNg2Loader(ng2ModulerRef.injector);
let container = document.getElementById('audit-trigger');
console.log("Containers");
console.log(container);
let loadedComponentReferences = [];
let count = 0;
if (container) {
let parent = document.createElement('audit-components');
container.appendChild(parent);
let compRef = ng2Loader.loadComponentAtDom(AuditComponent, parent, (instance) => {
instance.value = count;
});
loadedComponentReferences.push(compRef);
}
});
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.
Online forums and learning are now in one easy-to-use experience.
By continuing, you accept the updated Community Terms of Use and acknowledge the Privacy Policy. Your public name, photo, and achievements may be publicly visible and available in search engines.
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.