Commit 7352b22a3ec1ccc73f51420a239a6ff1b4dd6872
1 parent
f9a71d96
Exists in
master
and in
26 other branches
Dynamically load article editor component based on specific type
Showing
4 changed files
with
31 additions
and
3 deletions
Show diff stats
src/app/article/cms/article-editor/article-editor.component.ts
0 → 100644
... | ... | @@ -0,0 +1,28 @@ |
1 | +import {Component, Input, Inject} from 'ng-forward'; | |
2 | + | |
3 | +@Component({ | |
4 | + selector: 'article-editor', | |
5 | + template: "not-used" | |
6 | +}) | |
7 | +@Inject("$element", "$scope", "$injector", "$compile") | |
8 | +export class ArticleEditorComponent { | |
9 | + | |
10 | + @Input() article: noosfero.Article; | |
11 | + | |
12 | + constructor( | |
13 | + private $element: any, | |
14 | + private $scope: ng.IScope, | |
15 | + private $injector: ng.auto.IInjectorService, | |
16 | + private $compile: ng.ICompileService) { } | |
17 | + | |
18 | + ngOnInit() { | |
19 | + let articleType = this.article.type; | |
20 | + articleType = articleType.replace(/::/, ''); | |
21 | + let specificDirective = `${articleType.charAt(0).toLowerCase()}${articleType.substring(1)}Editor`; | |
22 | + let directiveName = "article-basic-editor"; | |
23 | + if (this.$injector.has(specificDirective + 'Directive')) { | |
24 | + directiveName = specificDirective.replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase(); | |
25 | + } | |
26 | + this.$element.replaceWith(this.$compile('<' + directiveName + ' [article]="ctrl.article"></' + directiveName + '>')(this.$scope)); | |
27 | + } | |
28 | +} | ... | ... |
src/app/article/cms/basic-editor/basic-editor.component.ts
src/app/article/cms/cms.component.ts
... | ... | @@ -4,6 +4,7 @@ import {ProfileService} from "../../../lib/ng-noosfero-api/http/profile.service" |
4 | 4 | import {NotificationService} from "../../shared/services/notification.service.ts"; |
5 | 5 | import {BasicOptionsComponent} from './basic-options/basic-options.component'; |
6 | 6 | import {BasicEditorComponent} from './basic-editor/basic-editor.component'; |
7 | +import {ArticleEditorComponent} from './article-editor/article-editor.component'; | |
7 | 8 | |
8 | 9 | @Component({ |
9 | 10 | selector: 'article-cms', |
... | ... | @@ -13,7 +14,7 @@ import {BasicEditorComponent} from './basic-editor/basic-editor.component'; |
13 | 14 | provide('profileService', { useClass: ProfileService }), |
14 | 15 | provide('notification', { useClass: NotificationService }) |
15 | 16 | ], |
16 | - directives: [BasicOptionsComponent, BasicEditorComponent] | |
17 | + directives: [ArticleEditorComponent, BasicOptionsComponent, BasicEditorComponent] | |
17 | 18 | }) |
18 | 19 | @Inject(ArticleService, ProfileService, "$state", NotificationService, "$stateParams", "$window") |
19 | 20 | export class CmsComponent { | ... | ... |
src/app/article/cms/cms.html
... | ... | @@ -2,7 +2,7 @@ |
2 | 2 | <div class="row"> |
3 | 3 | <div class="col-md-1"></div> |
4 | 4 | <div class="col-md-8"> |
5 | - <article-basic-editor ng-if="vm.article" [article]="vm.article"></article-basic-editor> | |
5 | + <article-editor ng-if="vm.article" [article]="vm.article"></article-editor> | |
6 | 6 | </div> |
7 | 7 | <div class="col-md-3"> |
8 | 8 | <article-basic-options ng-if="vm.article" [article]="vm.article"></article-basic-options> | ... | ... |