2016-05-12 2 views
0

Я изучаю Electron и создаю собственное приложение типа «привет мир», которое работает. Я начал изучать его, как час назад, так что любые приветливые советы noob высоко ценятся.Как использовать eventListeners с Angularjs + Electron?

Я решил включить угловой материал + угловой материал для его стилизации и посмотреть, как он работает. Теперь моя часть кода, который отправляет уведомление, не работает. Это подняло вопрос.

Как отправить события click от угловых к электрону?

Вот пример кода из всех файлов

main.js скопированных из прибудете стартером электронной GitHub страницу

const electron = require('electron'); 
const {ipcMain} = require('electron'); 
// Module to control application life. 
const {app} = electron; 
// Module to create native browser window. 
const {BrowserWindow} = electron; 

// Keep a global reference of the window object, if you don't, the window will 
// be closed automatically when the JavaScript object is garbage collected. 
let win; 



function openInbox() { 
    win.loadURL('https://inbox.google.com/?pli=1'); 
} 

function createWindow() { 
    // Create the browser window. 
    win = new BrowserWindow({width: 1366, height: 768}); 

    // and load the index.html of the app. 
    win.loadURL(`file://${__dirname}/index.html`); 
    win.openDevTools(); 

    // Emitted when the window is closed. 
    win.on('closed',() => { 
    // Dereference the window object, usually you would store windows 
    // in an array if your app supports multi windows, this is the time 
    // when you should delete the corresponding element. 
    win = null; 
    }); 
} 

// This method will be called when Electron has finished 
// initialization and is ready to create browser windows. 
// Some APIs can only be used after this event occurs. 
app.on('ready', createWindow); 

// Quit when all windows are closed. 
app.on('window-all-closed',() => { 
    // On OS X it is common for applications and their menu bar 
    // to stay active until the user quits explicitly with Cmd + Q 
    if (process.platform !== 'darwin') { 
    app.quit(); 
    } 
}); 

app.on('activate',() => { 
    // On OS X it's common to re-create a window in the app when the 
    // dock icon is clicked and there are no other windows open. 
    if (win === null) { 
    createWindow(); 
    } 
}); 

// In this file you can include the rest of your app's specific main process 
// code. You can also put them in separate files and require them here. 

ctrl.js // визуализатор файл, который используется для работы и отправлять уведомления до включения углового груза + материала lib

const {ipcRenderer} = require('electron'); 

const button = document.getElementById('button'); 

button.addEventListener('click', evt => { 
    new Notification('Angular Material FTW!'); 
}); 

index.html

<!DOCTYPE html> 
<html ng-app="webApp"> 
    <head> 
    <meta charset="UTF-8"> 
    <title>Hello World!</title> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js"></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-animate.min.js"></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-aria.min.js"></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/angular_material/1.0.7/angular-material.min.js"></script> 
    <script src="angular-main.js"></script> 
    <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/angular_material/1.0.7/angular-material.min.css"> 
    </head> 
    <body layout-align="center center" layout-padding> 
    <h1 id="hello">Hello World!</h1> 
    <div></div> 
    <md-button class="button md-raised md-primary">Click Me</md-button> 
    </body> 
    <script src="ctrl.js"></script> 
</html> 

угловой main.js Угловая файл

(function() { 
    angular 
    .module('webApp', ['ngMaterial']) 
    .config(themeConfiguration) 
    .controller('appCtrl', appCtrl); 

    function themeConfiguration($mdThemingProvider) { 
    $mdThemingProvider.theme('default') 
     .primaryPalette('blue', { 
     'default': '500' 
     }) 
     .accentPalette('red') 
     .warnPalette('deep-orange') 
     .backgroundPalette('grey', { 
     'default': '100' 
     }); 
    } 

    function appCtrl() { 
    var vm = this; 

    vm.notification = function Notification(evt) { 
     new Notification('Hello angular'); 
    }; 
    } 
})(); 

Если удалить Angularjs и материал на ctrl.js работ и отправить уведомление только штрафом.

ответ

0

Отвечая на мой собственный вопрос, чтобы заставить вещи работать только разместить код внутри angularjs функции контроллера, как это

function appCtrl() { 
    var vm = this; 

    const button = document.getElementById('button'); 

    button.addEventListener('click', evt => { 
     new Notification('Angular Material FTW!'); 
    }); 
    }