這太瘋狂了。我正在爲此網站開發一個客戶端,用戶可以將嵌入代碼從YouTube上粘貼到屏幕上的文本區域。他們點擊「添加」,代碼被放入一個對象的屬性中,然後被轉到數組的末尾。然後您會看到您的「視頻列表」,並且有一個「新」按鈕可以添加更多視頻。只要單擊頁面上的「新建」按鈕添加第二個,IE就會凍結。我試過IE 9--它幾乎100%的時間 - 一旦它工作了,但我已經添加了其他的東西。
IE10似乎工作正常,但我可以發誓我之前有問題 - 但今晚,它確實很好。
更新:剛剛在Windows XP上測試IE8 - 沒有問題。AngularJS + IE + iframe粘貼在textarea =崩潰的瘋狂
經過很多調試,我相信我已經得出了一個瘋狂的結論,如果iframe是560像素或更寬,它會崩潰......如果您改變大小說550,沒有問題......所有這一切有問題的iframe是不實際的頁面上(你可以預覽它,但它沒有顯示,甚至在默認情況下注入的頁面。)
其他一些注意事項:
我試圖插入一個簡單的iframe,只是一個src屬性 - 沒有問題。
我嘗試插入一個HTML BUNCH - 沒有問題。
我試圖插入無效的HTML - 沒有問題。
我採用了YouTube的代碼,更改了網址 - 存在問題。
我試着再用手鍵入YouTube的代碼 - HAD問題的問題(希望一些奇怪的編碼或東西時,我嘗試這樣做)
這個網站正逐漸接近完成,所以有這方面的幫助將是非常感激!
爲了您的方便我設置一個站點,以實際看到這:
您需要先登錄:
用戶名:[email protected]
密碼:test1234
然後進入/提交或點擊導航欄中的「賣你的車」,然後點擊後面的頁面上的「快速列出」。
您可以立即進入「YouTube視頻」選項卡,並嘗試 - 你不必在整個標籤工作的方式...
下面是一些代碼(CoffeeScript的&玉 - JavaScript的HTML &能可以看到網站上的...)
控制器年初,我在視頻列表初始化爲空數組:
$scope.formData =
videos: []
這裏的新影片何時提交時調用的方法(編輯略有下降)
$scope.addVideo = ->
v = {
id: 0
code: $scope.new_video.code
listing_id: $scope.listing_id
}
$scope.formData.videos.push v
$scope.new_video.adding = false # hides the "add" form.
$scope.new_video.code = ''
呈現在商家信息編輯器中的視頻選項卡中的HTML(我使用AngularUI引導這個)
pane(heading="YouTube Videos", active="panes.videoActive")
div(ng-show="new_video.adding || !formData.videos.length")
h4 Add Video
p Paste the embed code from YouTube to add video:
textarea(ng-model="new_video.code")
br
a.btn.btn-primary(ng-click="addVideo()") <i class="icon-save"></i> Add Video
|
a.btn.btn-danger(ng-click="new_video.adding = false;new_video.code=''") <i class="icon-trash"></i> Cancel
div(ng-show="!new_video.adding && formData.videos.length")
.row-fluid
.span6
h4 YouTube Videos
.btn-group
button.btn.btn-small.btn-success(ng-click="new_video.adding = true") <i class="icon-plus"></i> New
button.btn.btn-small.btn-info(ng-show="listing_id>0", ng-click="saveVideoOrder()",ng-disabled="new_video.saving_sort") <i class="icon-save"></i> Save Order
i.icon-spinner.icon-spin(ng-show="new_video.saving_sort")
ul.unstyled.video-list(ui-sortable, ng-model="formData.videos")
li(ng-repeat="v in formData.videos",style="position:relative;padding-left:16px")
span(style="position:absolute;top:0;left:0;cursor:ns-resize") <i class="icon-resize-vertical"></i>
textarea(ng-model="v.code")
.btn-group
button.btn.btn-danger(ng-click="deleteVideo(v)", ng-disabled="new_video.deleting") <i class="icon-trash"></i> Delete
span(ng-show="new_video.deleting")
i.icon-spinner.icon-spin
button.btn.btn-info(ng-click="new_video.preview_code=v.code") <i class="icon-eye-open"></i> Preview
button.btn.btn-primary(ng-click="v = updateVideo(v)", ng-disabled="v.updating") <i class="icon-save"></i> Update
i.icon-spinner.icon-spin(ng-show="v.updating")
.span6(ng-show="new_video.preview_code")
h4 Preview
a.btn.btn-danger.btn-mini(ng-click="new_video.preview_code = false")
i.icon-eye-close
| Close
div(ng-bind-html-unsafe="new_video.preview_code")
FYI:大多數網站的完成。Angular僅用於表單上的前端:註冊,個人檔案,提交汽車,信用系統&信用申請。管理員是一個完整的角度應用程序,但你必須找到一份工作與客戶看到 - 即使如此 - 我不知道! =)
爲什麼要求用戶添加Youtube嵌入代碼,而不是僅僅綁定到頁面上已嵌入代碼的視頻url?你認爲這可能會有所作爲嗎? – jpmorin