Question

我是离子的新手我正在关注ionic framework documents来学习它。

这是我方法的代码： hello-ionic.ts

  openActionSheet(){
    let actionSheet=this.actionsheetCtrl.create(
    {
        title: 'Modify your album',
        cssClass: 'page-hello-ionic',
        buttons:[
          {
            text: 'Delete',
            role: 'destructive', //will always sort to be on top
            icon: !this.platform.is('ios') ? 'trash' : null,
            handler: () => {
              console.log('Delete clicked');
            }
          },
          {
          text: 'Play',
          icon: !this.platform.is('ios') ? 'arrow-dropright-circle' : null,
          handler: () => {
            console.log('Play clicked');
          }   
        },
        {
          text: 'Favorite',
          icon: !this.platform.is('ios') ? 'heart-outline' : null,
          handler: () => {
            console.log('Favorite clicked');
          }
        },
        {
          text: 'Cancel',
          role: 'cancel', // will always sort to be on the bottom
          icon: !this.platform.is('ios') ? 'close' : null,
          handler: () => {
            console.log('Cancel clicked');
          }
        }
      ]});
    actionSheet.present();
  }

代码工作正常。但我想知道在哪里打印console.log()。任何人都可以帮我吗？

Answer 1

要检查控制台日志，您可以在以下命令后使用浏览器：

第1步： $ionic serve（将在localhost上运行您的应用）

第2步：在各自的浏览器（Chrome，safari等等）中，您的应用运行右键+点击并检查您的应用程序，如下面的屏幕截图。

第3步：您将在右侧窗口和左侧的应用程序屏幕上看到包含HTML元素的窗口，您可以在其中检查右侧的设计代码。

第4步：在右侧窗口中，您可以找到＆＃34;控制台＆＃34;顶栏上的菜单选项。点击它，您将获得您的应用程序，您可以在其中找到您的应用程序日志或错误或警告生成的离子。

修改

对于real-device或emulator或genymotion控制台日志，请检查以下步骤＆amp;屏幕截图。

第1步：运行此命令在真实设备或模拟器上运行您的应用

$ionic cordova run android

第2步：在设备或模拟器上成功启动应用后转到Chrome浏览器并＆＃34;右键单击＆＃34; ，然后点击＆＃34;检查＆＃34; ，您将在浏览器底部的屏幕下方看到。

第3步：点击＆＃34;远程设备＆＃34; 将显示已连接的真实设备或模拟器列表。

从该设备列表中单击该设备名称右侧的＆＃34; Inspect＆＃34; 按钮（检查相同的屏幕截图）将打开新窗口现在，使用您的设备镜像所有控制台都可以使用此调试器。

希望这可以帮助您调试应用。

Answer 2

如果要在ionic应用程序中获取Live控制台日志（真实设备或模拟器）

ionic cordova run android --livereload  --consolelogs --serverlogs

Answer 3

在使用模拟器进行调试时，您可以使用 chrome inspect 来获取控制台日志。打开 chrome 并输入以下内容：

chrome://inspect:device

您可以看到设备中列出的 ionic 设备，您可以按照 in this video

所述使用检查和检查 console.logs

Answer 4

当我使用Ionic在移动设备上测试网站时，通常我不希望运行Remote devices窗口，因为我需要选择移动设备，然后选择移动浏览器中的大量标签-然后依次选择inspect和之后在手机上进行刷新-断开连接...

出于真正的调试目的，我更喜欢使用-c运行Ionic，然后在终端中看到没有任何断开连接的控制台。

my-server$ ionic serve -c --no-open --address 192.168.1.112

[INFO] Development server running!
       Local: http://192.168.1.112:8100    
       Use Ctrl+C to quit this process

在我的移动设备上浏览到：http://192.168.1.112:8100

日志将出现在运行Ionic cli的终端中：

[app-scripts] [09:49:42]  console.log: Angular is running in the development mode. Call enableProdMode() to enable the production
[app-scripts]             mode.
[app-scripts] [09:49:42]  console.log: cookieEnabled: true

ionic：在哪里查看显示的控制台日志

4 个答案: