Alors j'essaie d'intégrer l'édition inine de CKeditor avec knockout.js. Je suis capable de charger avec succès le ckedititor et knockout.js.
Je n'arrive pas à obtenir la mise à jour ko.observable la propriété: p> voici le HTML: P> <div id="editable" contenteditable="true" data-bind="html: editorText">
</div>
<div>
<input type="button" data-bind="click: testNewValue" value="test" />
</div>
3 Réponses :
Vous devez écrire votre gestionnaire de liaison personnalisé pour que votre propriété observable soit liée à une instance de CKeditor.
Tout d'abord, vous pouvez commencer à partir de la liaison personnalisée trouvée ICI . L'un des postes contient une liaison personnalisée, bien que je ne suis pas sûr que cela fonctionne. Vous devez vérifier. Je l'ai copié ici, les crédits ne me rendent pas bien sûr: une utilisation typique serait alors dans le code HTML: Deuxièmement, vous pouvez consulter le gestionnaire de liaison personnalisé pour TinyMCE Initialement écrit par Ryan Niemeyer et mis à jour par d'autres personnes talentueuses. Peut-être TinyMCE pourrait vous entraîner à la place de CKeditor?
Euh, je ne sais honnêtement pas. Je devais d'abord aller sur le site Web de Ckedititor4 pour savoir ce que signifie «montage en ligne» :-) Mais la meilleure façon de voir qu'il serait d'écrire le code :-)
Steve Sanderson est le créateur de Knockoutjs, Ryan Niemeyer est un gars génial.
Cela fonctionne, mais n'oubliez pas d'inclure JQuery Adapter pour Dernier CKeditor comme mentionné sur NUITLY.CKEDITOR.COM/14-09-02-06-07/Standard/Semples/.../a>. Sinon $ (...). CKEditor Call échouera.
Au moins sur CKEDITOR 4.4.7, j'ai constaté que l'événement "Changement" était le meilleur à utiliser afin de s'assurer que la liaison Knockout a été mise à jour dans tous les cas, plutôt que "flou". Par exemple, si vous copiez / coller du texte dans la fenêtre CKEDITOR puis appuyez immédiatement sur un bouton pour enregistrer le sous-jacent observable. Il suffit de courir dans cette question et l'événement «changement» a attrapé les mises à jour appropriées dans chaque cas.
Cela fonctionne très bien, rappelez-vous simplement d'inclure l'adaptateur JQuery dans le bon ordre. Première jQuery, puis ckeditor, puis l'adaptateur JQuery et enfin le gestionnaire de liaison. L'adaptateur est situé dans le dossier "Adaptateurs" du téléchargement CKEditor.
Je n'avais pas beaucoup de chance avec le changement au lieu de flou. Le changement pour moi a fait le scintillement de l'écran sur chaque frappe (ce qui a du sens puisqu'il met constamment à jour). La chose vraiment étrange était que tout texte que je suis entré a été affiché à l'envers!
Pour répondre à votre question spécifique, vous devez suivre une trace d'où provient une modification de sorte que la mise à jour n'est pas déclenchée deux fois. Lorsque l'observable est mis à jour non pas à partir de l'éditeur, vous ne voulez pas que le changement soudain de l'éditeur soit rétabli l'observable. Même idée Lorsque l'éditeur met à jour l'observable, vous ne voulez pas que l'observable avertit à nouveau l'éditeur. J'avais l'habitude de booléans pour les suivre. Le code de la rédaction-agnostique est ci-dessous:
<div data-bind="wysiwyg: test"></div>
Quiconque tente de le faire avec CKEDITOR 5, les travaux suivants (application Legacy)
La liaison HTML est Pas à deux voies . Vous devez créer votre propre reliure personnalisée pour contentieux .
C'est ça. Merci!
Il y a aussi Frombala, qui ne mettra pas votre CSS en ligne. Plugin Knockout: github.com/froala/knockout-froala