2017-04-13 95 views
2

我想單擊一個按鈕在我的組件中打開文件夾對話框。這裏是我想要做的事:如何從角度2組件打開電子對話框?

HTML:

<div> 
    <input class="u-full-width" placeholder="Folder" type="text" [(ngModel)]="folder"> 
    <button id="browse" class="button-primary" (click)="browse()">Browse</button> 
    <input id="fileInput" type="file" style="display: none" /> 
</div> 

component.ts

// var remote = require('remote'); 
// var dialog = remote.require('dialog'); 

    folder: string; 
    browse() { 
    dialog.showOpenDialog({title: 'Select a folder', properties: ['openDirectory']}, (folderPath) => { 
     if (folderPath === undefined){ 
      console.log("You didn't select a folder"); 
      return; 
     } 
     this.folder = folderPath; 
    }); 
    } 

所以,我該如何導入遠程和對話?

回答

0

你很近。根據文檔(https://github.com/electron/electron/blob/master/docs/api/dialog.md)在渲染器中使用它,您需要執行const {dialog} = require('electron').remote,因此您的第一個remote變量不是必需的。

+0

謝謝您的回答。但是,當我嘗試這段代碼時,我在瀏覽器控制檯中出現錯誤:Uncaught TypeError:fs.​​existsSync不是Object中的函數。 (vendor.bundle.js:72631)...',並且該應用只顯示「正在加載...」 – newman

+0

我明白了。在您創建窗口的主要過程中,是否禁用節點集成?如果是這樣,那麼你可能需要將上面的代碼放到預加載腳本中。更多細節見https://github.com/electron/electron/issues/5113 –

+0

實際上,我從[https://github.com/onehungrymind/electrogram](https://github.com/onehungrymind/electrogram)切換到另一個示例代碼庫github.com/onehungrymind/electrogram),它有打開對話框的代碼。非常感謝你! – newman

0

您可以用ngx-electron庫嘗試

import {ElectronService} from 'ngx-electron' 

export class DialogHelper { 

    private static alert = new ElectronService().remote.dialog; 
}