您的位置:首頁技術文章
文章詳情頁

angular.js - angular-ueditor使用中,插入圖片,加載完成后不更新angularmodel的問題;

瀏覽:141日期:2024-09-20 16:50:12

問題描述

使用百度編輯器時,插入圖片初始為loading圖,載入成功后才顯示上傳的圖片,插入圖片后不做任何修改時,控制器中的model是這樣的

即使圖片已經上傳成功,在編輯器已經顯示出來了,但是model中還是沒有得到修改,只有再修改點其他東西,觸發ueditor的changecontent事件后,才會修改model;udeitor指令中的監聽changecontent:

_self.editor.addListener('contentChange', function() {ctrl.$setViewValue(_self.editor.getContent());if (!_updateByRender) {if (!$S.$$phase) {$S.$apply();}}_updateByRender = false;});

查看ueditor源碼:

function callback(){try{var link, json, loader,body = (iframe.contentDocument || iframe.contentWindow.document).body,result = body.innerText || body.textContent || ’’;json = (new Function('return ' + result))();link = me.options.imageUrlPrefix + json.url;if(json.state == ’SUCCESS’ && json.url) {loader = me.document.getElementById(loadingId);loader.setAttribute(’src’, link); loader.setAttribute(’_src’, link); loader.setAttribute(’title’, json.title || ’’);loader.setAttribute(’alt’, json.original || ’’);loader.removeAttribute(’id’); domUtils.removeClasses(loader, ’loadingclass’);} else {showErrorLoader && showErrorLoader(json.state);}}catch(er){showErrorLoader && showErrorLoader(me.getLang(’simpleupload.loadError’));}form.reset();domUtils.un(iframe, ’load’, callback);}

圖片上傳成功后,直接將原來loading圖的src修改成返回的鏈接,但是這樣卻沒有出發angular的$apply,實際上應該說是沒有出發changecontent,導致model沒有被更新;

求問大神,如何讓angular model 在修改img src屬性時得到更新呢?這問題困擾了很久了,之前看到博客有個大兄弟給changecontent里面加了個延遲

_self.editor.addListener('contentChange', function() {//此處設置一個延遲,防止圖片還沒有從服務器返回,從而獲取到的是loading圖片 setTimeout(function() {ctrl.$setViewValue(_self.editor.getContent());if (!_updateByRender) { if (!$S.$$phase) {$S.$apply(); }}_updateByRender = false;}, 50)});

但是治標不治本,如果我的圖片在50ms之后才載入,也是沒有用的。。。。找不到contentchange的事件代碼。

問題解答

回答1:

自己回到吧;方法一:在配置中 config取消單張圖片上傳,使用多張圖片上傳代替;方法二:修改ueditor.all.js中簡單上傳函數在圖片上傳完成后修改loading圖的src屬性,展示真實圖片后,在末尾插入一個空字符串來出發$apply;

angular.js - angular-ueditor使用中,插入圖片,加載完成后不更新angularmodel的問題;

相關文章:
国产综合久久一区二区三区