diff --git a/src/addon/mod/data/classes/field-plugin-component.ts b/src/addon/mod/data/classes/field-plugin-component.ts
new file mode 100644
index 000000000..dcd853b82
--- /dev/null
+++ b/src/addon/mod/data/classes/field-plugin-component.ts
@@ -0,0 +1,28 @@
+// (C) Copyright 2015 Martin Dougiamas
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+import { Input } from '@angular/core';
+
+/**
+ * Base class for component to render a field.
+ */
+export class AddonModDataFieldPluginComponent {
+ @Input() mode: string; // The render mode.
+ @Input() field: any; // The field to render.
+ @Input() value?: any; // The value of the field.
+ @Input() database?: any; // Database object.
+ @Input() error?: string; // Error when editing.
+ @Input() viewAction: string; // Action to perform.
+
+ constructor() { }
+}
diff --git a/src/addon/mod/data/components/components.module.ts b/src/addon/mod/data/components/components.module.ts
new file mode 100644
index 000000000..7b979b396
--- /dev/null
+++ b/src/addon/mod/data/components/components.module.ts
@@ -0,0 +1,50 @@
+// (C) Copyright 2015 Martin Dougiamas
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { IonicModule } from 'ionic-angular';
+import { TranslateModule } from '@ngx-translate/core';
+import { CoreComponentsModule } from '@components/components.module';
+import { CoreDirectivesModule } from '@directives/directives.module';
+import { CoreCourseComponentsModule } from '@core/course/components/components.module';
+import { AddonModDataIndexComponent } from './index/index';
+import { AddonModDataFieldPluginComponent } from './field-plugin/field-plugin';
+import { CoreCompileHtmlComponentModule } from '@core/compile/components/compile-html/compile-html.module';
+
+@NgModule({
+ declarations: [
+ AddonModDataIndexComponent,
+ AddonModDataFieldPluginComponent
+ ],
+ imports: [
+ CommonModule,
+ IonicModule,
+ TranslateModule.forChild(),
+ CoreComponentsModule,
+ CoreDirectivesModule,
+ CoreCourseComponentsModule,
+ CoreCompileHtmlComponentModule
+ ],
+ providers: [
+ ],
+ exports: [
+ AddonModDataIndexComponent,
+ AddonModDataFieldPluginComponent
+ ],
+ entryComponents: [
+ AddonModDataIndexComponent
+ ]
+})
+export class AddonModDataComponentsModule {}
diff --git a/src/addon/mod/data/components/field-plugin/field-plugin.html b/src/addon/mod/data/components/field-plugin/field-plugin.html
new file mode 100644
index 000000000..489bbda21
--- /dev/null
+++ b/src/addon/mod/data/components/field-plugin/field-plugin.html
@@ -0,0 +1,5 @@
+
+
+
+
+
\ No newline at end of file
diff --git a/src/addon/mod/data/components/field-plugin/field-plugin.ts b/src/addon/mod/data/components/field-plugin/field-plugin.ts
new file mode 100644
index 000000000..819d43e2d
--- /dev/null
+++ b/src/addon/mod/data/components/field-plugin/field-plugin.ts
@@ -0,0 +1,82 @@
+// (C) Copyright 2015 Martin Dougiamas
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+import { Component, Input, OnInit, Injector, ViewChild } from '@angular/core';
+import { AddonModDataProvider } from '../../providers/data';
+import { AddonModDataFieldsDelegate } from '../../providers/fields-delegate';
+import { CoreDynamicComponent } from '@components/dynamic-component/dynamic-component';
+
+/**
+ * Component that displays an assignment feedback plugin.
+ */
+@Component({
+ selector: 'addon-mod-data-field-plugin',
+ templateUrl: 'field-plugin.html',
+})
+export class AddonModDataFieldPluginComponent implements OnInit {
+ @ViewChild(CoreDynamicComponent) dynamicComponent: CoreDynamicComponent;
+
+ @Input() mode: string; // The render mode.
+ @Input() field: any; // The field to render.
+ @Input() value?: any; // The value of the field.
+ @Input() database?: any; // Database object.
+ @Input() error?: string; // Error when editing.
+ @Input() viewAction: string; // Action to perform.
+
+ fieldComponent: any; // Component to render the plugin.
+ data: any; // Data to pass to the component.
+ fieldLoaded: boolean;
+
+ constructor(protected injector: Injector, protected dataDelegate: AddonModDataFieldsDelegate,
+ protected dataProvider: AddonModDataProvider) { }
+
+ /**
+ * Component being initialized.
+ */
+ ngOnInit(): void {
+ console.error('HERE');
+ if (!this.field) {
+ this.fieldLoaded = true;
+
+ return;
+ }
+
+ // Check if the plugin has defined its own component to render itself.
+ this.dataDelegate.getComponentForField(this.injector, this.field).then((component) => {
+ this.fieldComponent = component;
+
+ if (component) {
+ // Prepare the data to pass to the component.
+ this.data = {
+ mode: this.mode,
+ field: this.field,
+ value: this.value,
+ database: this.database,
+ error: this.error,
+ viewAction: this.viewAction
+ };
+ } else {
+ this.fieldLoaded = true;
+ }
+ });
+ }
+
+ /**
+ * Invalidate the plugin data.
+ *
+ * @return {Promise} Promise resolved when done.
+ */
+ invalidate(): Promise {
+ return Promise.resolve(this.dynamicComponent && this.dynamicComponent.callComponentFunction('invalidate', []));
+ }
+}
diff --git a/src/addon/mod/data/components/index/index.html b/src/addon/mod/data/components/index/index.html
new file mode 100644
index 000000000..e53c61d7a
--- /dev/null
+++ b/src/addon/mod/data/components/index/index.html
@@ -0,0 +1,99 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+