如何设置一个通用调试窗口在离子/ angularjs

Question

我想有一个地方可以在开发离子应用程序时提供常见的调试信息。主要原因是为调试信息提供一个共同的地方，而不必在平台特定的地方查找这些信息。所以无论我在iOS还是Androis模拟器中，我都可以在同一个地方看到调试信息。

我已经为了这个目的，侧菜单中增加了一个“调试”页。我不知道如何从应用程序中的不同位置（即起始页面，终端页面等）向此页面添加信息。

我有一个模板“debug.html”与div容器，我想添加调试信息。

如何在应用程序中添加信息到div容器中的“debug.html”从任何地方？

Answer 1

您可以创建一个服务来存放一系列调试信息并在debug.html模板中显示该信息。一个简单的例子：

app.service('debug', function(){ 
    this.messages = []; 
    this.add = function(message){ 
    this.messages.push(message); 
    } 
}); 

且模板中：那么

app.controller('debugController', function(debug) { 
    this.debug = debug; 
}); 

，例如，开始页，：

<div ng-repeat="message in debug.messages">{{message}}</div> 

当然，注入模板控制器服务您可以添加调试信息是这样的：

app.controller('startPageController', function(debug, ...){ 
    debug.add("Start page controller initiated."); 
    ... 
});