Angular HtmlEditor - variables
Configures variables, which are placeholders to be replaced with actual values when processing text.
dataSource
If you use DevExtreme ASP.NET MVC Controls, refer to the Bind Controls to Data article.
The following list shows how to specify the dataSource property depending on your data source:
Data Array
Assign the array to the dataSource property.Read-Only Data in JSON Format
Set the dataSource property to the URL of a JSON file or service that returns JSON data.OData
Implement an ODataStore.Web API, PHP, MongoDB
Use one of the following extensions to enable the server to process data according to the protocol DevExtreme UI components use:Then, use the createStore method to configure access to the server on the client as shown below. This method is part of DevExtreme.AspNet.Data.
App.vue- <template>
- <DxHtmlEditor ... >
- <DxVariables :data-source="store"></DxVariables>
- </DxHtmlEditor>
- </template>
- <script>
- import 'devextreme/dist/css/dx.common.css';
- import 'devextreme/dist/css/dx.light.css';
- import CustomStore from 'devextreme/data/custom_store';
- import { createStore } from 'devextreme-aspnet-data-nojquery';
- import { DxHtmlEditor, DxVariables } from 'devextreme-vue/html-editor';
- export default {
- components: {
- DxHtmlEditor,
- DxVariables
- },
- data() {
- const serviceUrl = "https://url/to/my/service";
- const store = createStore({
- key: "ID",
- loadUrl: serviceUrl + "/GetAction"
- });
- return {
- store
- }
- }
- }
- </script>
Any other data source
Implement a CustomStore.
If you have technical questions, please create a support ticket in the DevExpress Support Center.