如何在Angularjs + Electron中使用eventListeners？

我正在學習Electron，並構建了自己的「hello world」類型的應用程序。 我開始學習它就像一個小時前，所以任何友好的技巧，高度讚賞。如何在Angularjs + Electron中使用eventListeners？

我決定加入angularjs + angular材料來設計它的風格，看看它是如何工作的。現在我的一段發送通知的代碼無法工作。這提出了一個問題。

如何將點擊事件從angularjs發送到電子？

這裏是所有文件

main.js從複製的範例代碼GET-啓動電子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是用來工作 //渲染文件並在包含angularjs + material 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作品，並通知就好了。

來源

2016-05-12 Nikki Kononov

回答我的問題，做事情的工作只是將代碼angularjs控制器函數中這樣

function appCtrl() { 
    var vm = this; 

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

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

來源

2016-05-12 15:17:24

如何在Angularjs + Electron中使用eventListeners？

回答

相關問題