Tôi có một video trên trang chủ của ứng dụng phát khi khởi chạy. Khi video kết thúc, tôi muốn sử dụng một số chuyển tiếp CSS 3 để di chuyển trang.Gọi chức năng điều khiển AngularJS khi video html5 kết thúc
<ion-view hide-back-button="true" title="">
<ion-pane>
<div class="home-video">
<video autoplay="autoplay" ng-click="ctrl.video()" aria-label="video of IBM logo" tabindex="-1" aria-hidden="true" poster="images/Hero_Final_Placeholder.gif" onended="ctrl.video()">
<source src="videos/video.mp4" type="video/mp4">
<img src="images/video_backup.gif" title="Your browser does not support the video tag.">
</video>
</div>
</ion-pane>
</ion-view>
Ở cuối video, tôi muốn có thể gọi hàm angularJS Controller.
'use strict';
angular.module('app', ['ionic']).config(function ($stateProvider, $urlRouterProvider) {
$stateProvider.state('home', {
url: "/home",
templateUrl: 'views/home.html',
controller: 'homeCtrl as ctrl'
}).state('project', {
url: "/project/:projectId",
templateUrl: 'views/project.html',
controller: 'projectCtrl'
});
// Default view to show
$urlRouterProvider.when('', '/home');
}).run(function ($http, pouchDB, replicationService, $rootScope) {
replicationService.replicate();
});
điều khiển của tôi trông giống như:
'use strict';
var app = angular.module('app', false);
app.controller('homeCtrl', function ($rootScope){
this.data = {};
var ctrl = this;
this.video = function() {
console.log("video done");
}
});
Nếu tôi đặt một console.log()
trong các yếu tố <video onended="">
nó in nó ra. Nếu tôi cố gắng và gọi ctrl.video()
chứa console.log cùng tôi nhận được lỗi sau:
Uncaught ReferenceError: ctrl is not defined
Tôi biết rằng ctrl được định nghĩa bởi vì nếu tôi thêm một ng-click="ctrl.video()"
và tôi nhấp vào video player nó in ra.
Bạn có biết vấn đề thực sự là gì không. –