Just My Life & My Work

[Ionic][AngularJS] 載入Youtube影片

2016 年 10 月 06 日

剛學習Ionic寫Hybrid App，AngularJS想要在頁面中載入Youtube影片，可以怎麼做呢？

[Ionic][AngularJS] 載入Youtube影片.png

原來可以這麼容易實現！

在Result.html中寫：


<div class="bar bar2-header">
<h1 class="title">學習成果</h1>
</div>

    </br></br></br></br></br>

在controllers.js中寫：

.controller('ResultCtrl', function($scope, $sce) {

  $scope.trustSrc = function(src) {
    return $sce.trustAsResourceUrl(src);
  }

  $scope.movie = {src:"https://www.youtube.com/embed/fdQgPu3iUYk", title:"好想你～"};

})

是有個問題待解決，怎麼決定Youtube影片高度？寬度設定100%馬上有效果，可是高度就不是啦⋯⋯有請高手幫忙！

好想你 I MiSS U這部影片是阿雅推薦給我聽的。

參考：External resource not being loaded by AngularJs。

分類：

AngularJS, Ionic, 教學

1 Comment

Tagged with:

Comments on: "[Ionic][AngularJS] 載入Youtube影片" (1)

  1. 未知 的大頭貼
    [Ionic][AngularJS] Youtube 離開畫面停止播放 | 逍遙文工作室 said:
    2017 年 07 月 01 日 於 00:51:01

    […] 承接[Ionic][AngularJS] 載入Youtube影片，想要離開畫面就停止播放，該怎麼做呢？因為進到下一頁，正在播放的影片還沒有被移除，就會持續播放下去。 […]

    讚

隨意留個言吧：）～

這個網站採用 Akismet 服務減少垃圾留言。進一步了解 Akismet 如何處理網站訪客的留言資料。

標籤雲