Dynamic loading of video file from showOpenDialog callback - AngularJs


I’m a noob and still confused about some things.

I’m using Angular with Electron and I’m trying to start a video loader when a dialog.showOpenDialog file is selected in main.js.

I’m doing this in main.js:

click(item, focusedWindow) {
                   {filters: [{ name: 'Video files', extensions: ['mkv', 'avi', 'mp4'] }],
                   properties: ['openFile']
                  }, (fileNames) => {
                        if (fileNames === undefined) return;
                       var videoFilePath = fileNames[0];
                       win.webContents.send('videoFilePath', videoFilePath);

In my videoCtrl.js I do this:

const electron = require('electron')
const ipcRenderer = electron.ipcRenderer
var app = angular.module('videoModule', []);

app.controller('videoCtrl', function ($scope) {

$scope.isVideoOpened = false;

ipcRenderer.on('videoFilePath', function (event, arg) {
    $scope.videoPathFile = arg;
    $scope.isVideoOpened = true;


and in my html I do this:

<div ng-controller="videoCtrl" ng-show="isVideoOpened">
                Here {{isVideoOpened}}
                <video id="v1" controls tabindex="0" autobuffer >
                    <source type="video/mp4; codecs=&quot;avc1.42E01E, mp4a.40.2&quot;" src="{{videoPathFile}}" />

When I open the video, the isVideoOpened is set to true and the videoPathFile is correct (if I open this filepath the same way in a separate it works).

However the file does not start buffering. What am I doing wrong?

Thank you in advance