非同期データでのビデオビデオプレーヤーの問題とコントローラでの `this.config`の問題

Question

私は、角度のビデオプレーヤーVideogularを使用しています。限り、私はしたい、素晴らしい作品

app.controller('ShowController', ['$sce', function($sce) { 

    this.config = { 
    preload: "auto", 
    sources: [ 
     {src: $sce.trustAsResourceUrl("https://firebasestorage.googleapis.com/v0/b/myFirebaseApp.appspot.com/o/videos%2Fen%2Fkingfisher.webm?alt=media&token=b4840120-e531-4699-a757-4e0d999ce9d1"), type: "video/webm"} 
    ], 
    theme: { 
     url: "http://www.videogular.com/styles/themes/default/latest/videogular.css" 
    } 
    }; 

}]); 

：コードはFirebaseストレージに格納された自分の動画を再生するには、次のようになりコントローラで

<div ng-controller="ShowController as controller" class="videogular-container"> 
    <videogular vg-theme="controller.config.theme.url"> 
    <vg-media vg-src="controller.config.sources" vg-tracks="controller.config.tracks" vg-native-controls="true"></vg-media> 
    </videogular> 
</div> 

：HTMLコードは次のようになります1つのビデオを再生する。うまく

app.controller('ShowController', ['$scope', '$firebaseStorage', '$sce', function($scope, $firebaseStorage, $sce) { 

    var ref = firebase.database().ref(); 

    var obj = $firebaseObject(ref.child($routeParams.id)); 

    obj.$loaded(
    function(data) { 
     console.log("Loaded!") 
     console.log(data === obj); 
     $scope.wordObject = data; 
     console.log($scope.wordObject.videos[0].videoURL); 
     console.log($scope.wordObject.videos[0].videoMediaFormat); 

     this.config = { 
     preload: "auto", 
     sources: [ 
      {src: $sce.trustAsResourceUrl($scope.wordObject.videos[0].videoURL), type: "video/" + $scope.wordObject.videos[0].videoMediaFormat} 
     ], 
     theme: { 
      url: "http://www.videogular.com/styles/themes/default/latest/videogular.css" 
     } 
     }; 

    }, 
    function(error) { 
     console.log("Error: ", error) 
    }); 

    }]); 

videoURLとvideoMediaFormatログ：しかし、動的動画の配列から選択することが、私はこれを書きました。しかし、ビデオソースもテーマもHTMLビューに読み込まれません。問題は、移動this.configがthisを参照するオブジェクトを変更したように見えます。 this.configは何をしているのですか？

callまたはapplyを使用してコントローラにthisをバインドできますか？

Answer 1

は、私はそれを考え出した：

app.controller('ShowController', ['$scope', '$firebaseObject', '$sce', function($scope, $firebaseObject, $sce) { 

    // Create Firebase reference 
    var ref = firebase.database().ref(); 

    var obj = $firebaseObject(ref.child($routeParams.id)); 
    $scope.wordObject = obj; 

    var controller = this; 

    obj.$loaded(
    function(data) { 
     console.log(data === obj); 
     $scope.wordObject = data; 

     // video player 
     controller.config = { 
     preload: "auto", 
     sources: [ 
      {src: $sce.trustAsResourceUrl($scope.wordObject.videos[0].videoURL), type: "video/" + $scope.wordObject.videos[0].videoMediaFormat}, 
     ], 
     theme: { 
      url: "http://www.videogular.com/styles/themes/default/latest/videogular.css" 
     } 
     }; 

    }, 
    function(error) { 
     console.log("Error: ", error) 
    }); 

    }]);