When applying font-size, the bullet list dots aren't affected by yhe changes as the MS Word behave:
MS Word
We are planning on using Angular 8 and Kendo UI for Angular for a major refactor project that currently utilizes RadRichTextBox for Silverlight.
We would like to utilize the Kendo UI for Angular Editor component.
The feature set our business users require and that is in RadRichTextBox we are currently using are:
- API to allow injecting contents into the current document in the editor at certain places by using bookmarks.
- The ability to save and load a saved file into the editor.
- Page Header and Footer
- Page Break
- Mail Merge
- Drag and Drop Content from List
- Printing/Print Preview
- Import/Export
We understand that some of these features are not currently implemented in the new component.
The roadmap on the Telerik website shows that additional functionalities are scheduled to be added to Kendo UI for Angular by September 18, 2019. Our question is if any of these things are planned to be added to Kendo UI for Angular and if so when? Or if there is another route involving Telerik you might suggest for incorporating these functionalities into an Angular 8+ project?
Thanks
-Nhan
When i refresh page wich contains Editor i give error - Cannot read property 'createElement' of null wheb i refresh page
i try hide edtor while not initilized, content initilized, this dont help
Please could you provide a built-in option ot insert alpha ordered list.
if editor recive a value like '<span class="platzhalter">Empfaenger_Debitor</span>'
by rendering console show this error
core.js:15724 ERROR TypeError: Cannot read property 'split' of nullat utils.js:181
at Array.map (<anonymous>)
at getUniqueStyleValues (utils.js:200)
at SafeSubscriber._next (index.js:1810)
at SafeSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.SafeSubscriber.__tryOrUnsub (Subscriber.js:194)
at SafeSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.SafeSubscriber.next (Subscriber.js:132)
at Subscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber._next (Subscriber.js:76)
at Subscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber.next (Subscriber.js:53)
at BehaviorSubject.push../node_modules/rxjs/_esm5/internal/Subject.js.Subject.next (Subject.js:47)
at BehaviorSubject.push../node_modules/rxjs/_esm5/internal/BehaviorSubject.js.BehaviorSubject.next (BehaviorSubject.js:38)
Currently, the kendoEditorCreateLinkButton does not provide a way to specify the Dialog container, as the following article demonstrates:
Please consider providing a built-in appendTo option to the link button directive. This will help to determine where the Dialog will be appended when the Editor is used within a kendoGridEditTemplate/kendoGridCellTemplate:
Using kendoGridEditTemplate:
https://stackblitz.com/edit/angular-yddl1n-inbwen
Using kendoGridCellTemplate:
https://stackblitz.com/edit/angular-yddl1n-t3afde
Sample code:
<div class="form-group">
<kendo-editor *ngIf="!formDisabled" [(ngModel)]="securityplan.dataFlow" id="dataFlow" name="dataFlow" style="height: 250px; width: 100%;">.
</kendo-editor>
</div>When you click into the body of the editor, "before emit" is console logged.
Steps to reproduce:
- Go to https://www.telerik.com/kendo-angular-ui/components/editor/tools/
- Choose any font-size parameter in the "Select font size" dropdown
- Open the dropdown again
Actual result: current value doesn't have selected styles in the dropdown
Expected result: current value in the dropdown is highlighted. Please see an example below:
When a list item is aligned to the center or the right, the list item marker remains aligned to the left instead of following the text. (A similar issue occurs when the document direction is RTL.)
Please introduce a feature that ensures the marker follows the item in accordance with its alignment similar to MS Word or Google Docs behavior.
Sometime but not always, the Editor will start to set the style attribute for each and every element, even though they are all the same.
Example Html:
<p>
<span style="color: rgb(53, 53, 53); font-family: "Open Sans", tahoma, arial, helvetica, sans-serif; font-size: 14px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: -webkit-left; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); text-decoration-thickness: initial; text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">Bedroom One</span>
<br style="color: rgb(53, 53, 53); font-family: "Open Sans", tahoma, arial, helvetica, sans-serif; font-size: 14px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: -webkit-left; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-thickness: initial; text-decoration-style: initial; text-decoration-color: initial;">
<span style="color: rgb(53, 53, 53); font-family: "Open Sans", tahoma, arial, helvetica, sans-serif; font-size: 14px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: -webkit-left; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); text-decoration-thickness: initial; text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">- Wrap, box and move non-affected contents and small furniture away from the affected area.</span>
<br style="color: rgb(53, 53, 53); font-family: "Open Sans", tahoma, arial, helvetica, sans-serif; font-size: 14px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: -webkit-left; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-thickness: initial; text-decoration-style: initial; text-decoration-color: initial;">
<span style="color: rgb(53, 53, 53); font-family: "Open Sans", tahoma, arial, helvetica, sans-serif; font-size: 14px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: -webkit-left; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); text-decoration-thickness: initial; text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">- Carryout inventory and dispose of non-restorable contents and furniture.</span>
</p>
How can I avoid this duplication?
This is my current configuration for the Kendo Editor:
<kendo-editor ctsStyle
[style.height]="to.height"
[formControl]="formControl"
[class.is-valid]="showError"
[formlyAttributes]="field"
>
<kendo-toolbar [overflow]="true">
<kendo-toolbar-buttongroup>
<kendo-toolbar-button kendoEditorBoldButton></kendo-toolbar-button>
<kendo-toolbar-button kendoEditorItalicButton></kendo-toolbar-button>
<kendo-toolbar-button kendoEditorUnderlineButton></kendo-toolbar-button>
</kendo-toolbar-buttongroup>
<kendo-toolbar-dropdownlist kendoEditorFormat></kendo-toolbar-dropdownlist>
<kendo-toolbar-buttongroup>
<kendo-toolbar-button kendoEditorAlignLeftButton></kendo-toolbar-button>
<kendo-toolbar-button kendoEditorAlignCenterButton></kendo-toolbar-button>
<kendo-toolbar-button kendoEditorAlignRightButton></kendo-toolbar-button>
<kendo-toolbar-button kendoEditorAlignJustifyButton></kendo-toolbar-button>
</kendo-toolbar-buttongroup>
<kendo-toolbar-buttongroup>
<kendo-toolbar-button kendoEditorInsertUnorderedListButton></kendo-toolbar-button>
<kendo-toolbar-button kendoEditorInsertOrderedListButton></kendo-toolbar-button>
<kendo-toolbar-button kendoEditorIndentButton></kendo-toolbar-button>
<kendo-toolbar-button kendoEditorOutdentButton></kendo-toolbar-button>
</kendo-toolbar-buttongroup>
</kendo-toolbar>
</kendo-editor>
Hi team,
Zoom in /out options are required to view the content of the editor.
Regards,
Babu
I would love to create some predefined values, and when the user selects the value from the dropdown, it will insert it in the cursor position.
This will give us the ability to define some placeholders in the text.