在离子框架中将视频上传到Firebase uing ngCordova($ cordovaCapture) [英] Uploading video to Firebase uing ngCordova ($cordovaCapture) in ionic framework
问题描述
如何上传我使用手机录制的视频。我设法将视频路径上传到Firebase,但是当我想在我的视图(html文件)中使用它时,它不起作用。这是我的代码:
How to upload video that I record using my mobile. I manage to upload the video path to Firebase but when I want to use it in my view (html file), it does not work. Here is my code:
.controller("HomeCtrl", function($scope, $firebaseArray, $cordovaCamera, $location, $cordovaCapture){
var fb = new Firebase("https://myURL.firebaseio.com/videos");
$scope.videos;
$scope.record = function(){
fb = new Firebase("https://myURL.firebaseio.com/videos");
$scope.videos = $firebaseArray(fb);
var options = { limit: 1, duration: 15 };
$cordovaCapture.captureVideo(options).then(
function(videoData) {
var i, path, len;
var pathtogo;
var pathtogostring;
for (i = 0, len = videoData.length; i < len; i += 1) {
path = videoData[i].fullPath;
pathtogo = path.toString();
pathtogostring = pathtogo.substr(6);
alert("Path of the video is = " + path.toString());
obj = {
videoP: path,
videosrc: pathtogostring
}
$scope.videos.$add(obj);
}
},
function(err) {
}
);
}//end record
})//end controller
我的html文件
<div ng-repeat="video in videos" class="card">
<div class="item item-text-wrap">
{{video.videoP}}
</div>
<div class="item item-text-wrap">
{{video.videosrc}}
</div>
<video controls>
<source src="video.videosrc" type="video/mp4">
</video>
</div>
推荐答案
如果不自行运行应用程序很难说,但是我确实看到你的记录
函数存在问题。
It's hard to tell without running the app myself, but I do see an issue with your record
function.
不要初始化 $ firebaseArray
在记录
函数内部,在控制器初始化时执行:
Don't initialize the $firebaseArray
inside of the record
function, do it when the controller initializes:
.controller("HomeCtrl", function($scope, $firebaseArray, $cordovaCamera, $location, $cordovaCapture){
var fb = new Firebase("https://myURL.firebaseio.com/videos");
$scope.videos = $firebaseArray(fb);
$scope.record = function record() {
// ... your record code here
};
})
$ firebaseArray
与服务器同步,因此只需要创建一次。
The $firebaseArray
is in sync with the server, so it only needs to be created once.
至于您的显示问题...
您需要更改< source> <中的
src
属性/ code>到 ng-src
,并使用卷曲 {{}}
进行插值:
You need to change the src
attribute in <source>
to ng-src
, and use curlys {{ }}
to interpolate:
<video controls>
<source ng-src="{{video.videosrc}}" type="video/mp4">
</video>
有关HTML attrs vs指令的更多信息,请参阅此答案。
这篇关于在离子框架中将视频上传到Firebase uing ngCordova($ cordovaCapture)的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!