問題描述

這種控件是怎樣實現(xiàn)的，自己寫似乎很復(fù)雜，在網(wǎng)上找到的資料又很少。要求，p改變大小的時候可以綁定到angularjs一個控制器的$scope.styles對象里，styles對象有width,height,left,top,rotate五個屬性。

問題解答

通過

var p = angular.element(document.querySelector(’#p’))console.debug(p[0].offsetHeight）

可以獲得該元素的完整數(shù)據(jù)，例如offsetHeight: 74offsetLeft: 281offsetParent: bodyoffsetTop: 698offsetWidth: 834，在directive中監(jiān)聽修改，應(yīng)該是可以的。

后來研究了下jqueryui里resizable插件，基本可以實現(xiàn)這個功能，但存在缺陷，如沒有選擇哪個控點，整個p框的變形是以左上角為基準(zhǔn)點的，變形起來不是很人性化。