ngOnInit() {
if (!this.id) {
return;
}
const componentType = this.extensionService.getComponentById(this.id);
if (componentType) {
const factory = this.componentFactoryResolver.resolveComponentFactory(
componentType
);
if (factory) {
this.content.clear();
this.componentRef = this.content.createComponent(factory, 0);
this.updateInstance();
}
}
}
/** Attach the given ComponentPortal to this PortalHost using the ComponentFactoryResolver. */
attachComponentPortal<T>(portal: ComponentPortal<T>): ComponentRef<T> {
portal.setAttachedHost(this);
// If the portal specifies an origin, use that as the logical location of the component
// in the application tree. Otherwise use the location of this PortalHost.
let viewContainerRef = portal.viewContainerRef != null ?
portal.viewContainerRef :
this._viewContainerRef;
let componentFactory =
this._componentFactoryResolver.resolveComponentFactory(portal.component);
let ref = viewContainerRef.createComponent(
componentFactory, viewContainerRef.length,
portal.injector || viewContainerRef.parentInjector);
this.setDisposeFn(() => ref.destroy());
return ref;
}
this._zone.run(() => {
const injector = Injector.create({
providers: [
{provide: Params, useValue: new Params(params || {})},
{provide: OnsSplitterSide, useValue: this}
],
parent: this._injector
});
const factory = this._resolver.resolveComponentFactory(page);
const pageComponentRef = this._viewContainer.createComponent(factory, 0, injector);
const pageElement = pageComponentRef.location.nativeElement;
componentRefMap.set(pageElement, pageComponentRef);
this.element.appendChild(pageElement); // dirty fix to insert in correct position
done(pageElement);
});
this._zone.run(() => {
const factory = this._resolver.resolveComponentFactory(componentType);
const injector = ReflectiveInjector.resolveAndCreate([
{provide: Params, useValue: new Params(params)}
], this._injector);
const componentRef = factory.create(injector);
const rootElement = componentRef.location.nativeElement;
this._componentLoader.load(componentRef);
const element = rootElement.children[0];
const alertDialogElement = element.tagName === 'ONS-ALERT-DIALOG' ? element : element.querySelector('ons-alert-dialog');
if (!alertDialogElement) {
throw Error('<ons-alert-dialog> element is not found in component\'s template.');
}
resolve({alertDialog: alertDialogElement, destroy: () => componentRef.destroy()});
});
setImmediate(() => {
const factory = this._resolver.resolveComponentFactory(componentType);
const injector = ReflectiveInjector.resolveAndCreate([
{provide: Params, useValue: new Params(params)}
], this._injector);
const componentRef = factory.create(injector);
const rootElement = componentRef.location.nativeElement;
this._componentLoader.load(componentRef);
const element = rootElement.children[0];
const modalElement = element.tagName === 'ONS-MODAL' ? element : element.querySelector('ons-modal');
if (!modalElement) {
throw Error('<ons-modal> element is not found in component\'s template.');
}
resolve({modal: modalElement, destroy: () => componentRef.destroy()});
});
/**
* Attach the given ComponentPortal to DOM element using the ComponentFactoryResolver.
* @param portal Portal to be attached
*/
attachComponentPortal<T>(
portal: ComponentPortal<T>,
newestOnTop: boolean,
): ComponentRef<T> {
const componentFactory = this._componentFactoryResolver.resolveComponentFactory(
portal.component,
);
let componentRef: ComponentRef<T>;
// If the portal specifies a ViewContainerRef, we will use that as the attachment point
// for the component (in terms of Angular's component tree, not rendering).
// When the ViewContainerRef is missing, we use the factory to create the component directly
// and then manually attach the ChangeDetector for that component to the application (which
// happens automatically when using a ViewContainer).
componentRef = componentFactory.create(portal.injector);
// When creating a component outside of a ViewContainer, we need to manually register
// its ChangeDetector with the application. This API is unfortunately not yet published
// in Angular core. The change detector must also be deregistered when the component
// is destroyed to prevent memory leaks.
this._appRef.attachView(componentRef.hostView);
this.setDisposeFn(() => {
this._appRef.detachView(componentRef.hostView);
componentRef.destroy();
});
// At this point the component has been instantiated, so we move it to the location in the DOM
// where we want it to be rendered.
if (newestOnTop) {
this._hostDomElement.insertBefore(
this._getComponentRootNode(componentRef),
this._hostDomElement.firstChild,
);
} else {
this._hostDomElement.appendChild(
this._getComponentRootNode(componentRef),
);
}
return componentRef;
}
this.route.url.subscribe(urls => {
const p = [];
urls.forEach(url => {
p.push(url.path);
});
const path = p.join('/');
this.screen = this.reg.screens[this.route.routeConfig.path];
if (!this.screen) {
throw new Error('Screen not found in registry');
}
const factory = this.resolver.resolveComponentFactory<any>(this.screen.component);
const componentRef = this.container.createComponent(factory);
this.title.setTitle(this.screen.title);
componentRef.instance.viewConfig = this.screen;
Object.keys(this.route.snapshot.params).forEach(k => {
componentRef.instance[k] = this.route.snapshot.params[k];
});
this.dynamicComponentContainer.insert(componentRef.hostView);
});
private _getContentRef(
moduleCFR: ComponentFactoryResolver, contentInjector: Injector, content: any,
context: NgbActiveModal): ContentRef {
if (!content) {
return new ContentRef([]);
} else if (content instanceof TemplateRef) {
const viewRef = content.createEmbeddedView(context);
this._applicationRef.attachView(viewRef);
return new ContentRef([viewRef.rootNodes], viewRef);
} else if (isString(content)) {
return new ContentRef([[document.createTextNode(`${content}`)]]);
} else {
const contentCmptFactory = moduleCFR.resolveComponentFactory(content);
const modalContentInjector =
ReflectiveInjector.resolveAndCreate([{provide: NgbActiveModal, useValue: context}], contentInjector);
const componentRef = contentCmptFactory.create(modalContentInjector);
this._applicationRef.attachView(componentRef.hostView);
return new ContentRef([[componentRef.location.nativeElement]], componentRef.hostView, componentRef);
}
}
return function(
node: Node,
view: EditorView,
getPos: () => number,
decorations: Decoration[],
) {
const injector = Injector.create({
parent: parentInjector,
providers: [
{
provide: NodeViewContext,
useValue: new NodeViewContext(node, view, getPos, decorations),
},
],
})
if (opts.directive) {
return injector.get(componentOrDirective)
} else {
const componentFactory = componentFactoryResolver.resolveComponentFactory(
componentOrDirective,
)
const componentRef = componentFactory.create(injector)
zone.onStable.pipe(take(1)).subscribe(() => {
appRef.attachView(componentRef.hostView)
})
if (componentRef.instance.destroy) {
componentRef.instance.destroy = () => {
componentRef.instance.destroy()
componentRef.destroy()
}
} else {
componentRef.instance.destroy = () => componentRef.destroy()
}
// type casting to access hidden prop
return componentRef.instance
}
}
this._answer.get_count_answer_by_question(element.question_id).subscribe((r:any)=>{
for (let index = 0; index < data.length; index++) {
if(element.questiontype_code == 'SR'){
let choice_content = JSON.parse(element.choices[0].choice_content);
let icon = choice_content.icon;
doughnutChartLabels = data.map(item => item.answer_value + ' ' + icon);
}else{
doughnutChartLabels = data.map(item => item.choice_content);
}
doughnutChartData =data.map(item => item.answer_count);
}
barChartLabels = doughnutChartLabels;
barChartData = [
{data : doughnutChartData, label : 'số lần chọn' }
];
let data1 = r.Data;
let item : any = {};
item.barChartData = barChartData;
item.barChartLabels = barChartLabels;
item.doughnutChartData = doughnutChartData;
item.doughnutChartLabels = doughnutChartLabels;
item.question_content = element.question_content;
item.question_ordered = element.question_ordered;
item.question_id = element.question_id;
item.answered_number = String(data1[0].answered_number);
item.not_answered_number = String(data1[0].not_answered_number);
//lstReport.push(item);
const factory = this._cr.resolveComponentFactory(ReportMultiChoiceComponent);
const choice = this.questionContainer.createComponent(factory);
choice.instance.barChartData = barChartData;
choice.instance.barChartLabels =barChartLabels;
choice.instance.doughnutChartData = doughnutChartData;
choice.instance.doughnutChartLabels = doughnutChartLabels;
choice.instance.question_content = element.content;
choice.instance.question_ordered = element.question_ordered;
choice.instance.question_id = element.question_id;
choice.instance.typeChart= 'doughnut';
choice.instance.answered_number = String(data1[0].answered_number);
choice.instance.not_answered_number = String(data1[0].not_answered_number);
choice.instance.change.subscribe(event => this.changeChart(event));
});
