javascript
  • angularjs
  • angularjs-directive
  • videogular
  • 2013-12-13 17 views 2 likes 
    2

    我使用的是https://github.com/2fdevs/videogular,開箱即用,效果很好,具體而言。與視頻指示互動 - 如何操作?

    <videogular vg-width="videoWidth" vg-height="videoHeight" > 
        <video class='videoPlayer' ng-model="currentVideo"> 
         <source ng-src='{{currentVideo.videoLocation}}' test="{{currentVideo}}" type='video/ogg'></source> 
        </video> 
    </videogular> 
    

    我不確定我會怎麼說,因爲自動播放不是真的,讓視頻播放以編程方式? 我知道我可以在我的控制器中包含上述標記,請撥打angular.element(),然後撥打.play(),但從我看過的內容看起來不對。我不應該在任何控制器內調用angular.element()

    我該怎麼辦?我應該創建一個這樣的指令嗎?哪裏是把爲「」和「暫停」的視頻(FWI,我想有個屏幕的視頻,一旦第一結束了,做幾件事情,然後播放第二)邏輯的最佳地點。

    +0

    正如你說你不應該做任何DOM操作的控制器,而這應該在一個指令,處理根據您的情況,什麼videogular提供它可能是最容易創造一個「插件」爲videogular,修改現有的視頻指令(這裏的問題是您必須合併您的更改以更新到新版本)或創建自己的指令,該指令使用「require」從視頻中獲取控制器。 – shaunhusain

    回答

    2

    昨天,我們已經暴露的API是通過$範圍入店,所以你可以訪問所有可用的方法。

    您可以檢查API here

    此版本還沒有可通過亭子,我們計劃做的這個週末。

    UPDATE

    知道當視頻已經完成的最好的辦法就是在你的控制器中添加範圍功能。

    $scope.onCompletePlayer1 = function() { 
        console.log("on complete 1"); 
    }; 
    
    $scope.onCompletePlayer2 = function() { 
        console.log("on complete 2"); 
    }; 
    

    然後在您的HTML中將這些函數添加到您的videogular指令中。

    <videogular vg-complete="onCompletePlayer1()" ...></videogular> 
    <videogular vg-complete="onCompletePlayer2()" ...></videogular> 
    

    最後加vg-complete爲$範圍功能videogular.js

    \\Line 159 
    vgComplete: "&" 
    
    \\Line 507 
    $scope.onComplete = function(event) { 
        vg.setState(VG_STATES.STOP); 
        $scope.$emit(VG_EVENTS.ON_COMPLETE); 
        $scope.vgComplete(); 
        $scope.$apply(); 
    }; 
    

    我們將努力在未來的版本中增加這個,所以也許你要等待幾天。

    +0

    你有這樣的例子嗎?通過$ scope訪問意味着什麼? – bobber205

    +0

    btw由於某種原因,當我更新我的videogular.js文件與回購它的忽略我的寬度和高度設置。 – bobber205

    +0

    我們已經推出了一個新的版本,只需看一下Github項目提供的最新版本中提供的示例。 – elecash

    相關問題