在 Electron 应用程序中单击菜单更改 AngularJS 状态

Question

我正在尝试使用 AngularJS 和菜单项制作一个 Electron 应用程序。我可以在主 Electron javascript 文件中定义此菜单项，如下所示：

var Menu = require('menu');
var menu = new Menu();
var tpl = [
        {
            label: 'Actions',
            submenu: [
                {
                    label: 'Xxxx',
                    click: function() { /* I want to change the state here */ }
                }
            ]
        }

    ];
menu = Menu.buildFromTemplate( tpl );
Menu.setApplicationMenu(menu);

但是我不知道当用户点击子菜单时如何改变 AngularJS 的状态（我正在使用 ui-router）。

我还试图根据应用程序中的控制器（或状态）更改 menuitems。我知道我不能在 Angular 代码中执行 require('menu') 那么，如何更改控制器中的菜单项？

谢谢

Answer 1

我要回答我自己的问题，我找到了解决方案。

使用 remote 模块，我可以将 Web 进程与主进程通信并调用主进程对象的方法。因此，在 AngularJS 应用程序的主控制器中，我可以执行以下操作：

.controller('AppController', function ($scope, $rootScope, $state,  $http, $location) {
    $rootScope.remote = require('remote');

    var Menu = $rootScope.remote.require('menu');
    var App = $rootScope.remote.require('app');

    var menu = new Menu();
    var tpl = [
        {
            label: 'Actions',
            submenu: [
                {
                    label: 'GoPage',
                    click: function() {

                        $state.go('samepage');

                    }
                },
                {
                    label: 'Quit',
                    click: function() { App.quit(); },
                    accelerator: 'Command+Q'
                }
            ]
        }

    ];
    menu = Menu.buildFromTemplate( tpl );
    Menu.setApplicationMenu(menu);

})

通过这种方式，我可以在菜单项单击时调用 AngularJS 函数，并根据应用程序中的控制器更改菜单项。

在 Electron 应用程序中单击菜单更改 AngularJS 状态

Change AngularJS state on menu click in an Electron app

angularjs

electron