可以从Angular ng-click表达式中调用"alert()"或"console.log()"吗? [英] Possible to call 'alert()' or 'console.log()' from Angular ng-click Expression?

问题描述

我正在尝试测试我的 ng-click 绑定是否正常工作-但我似乎遇到了一个更根本的问题-如何查看正在发生(或没有发生).

I was trying to test if my ng-click binding was working -- but I seem to be running into a more-fundamental problem -- how to see what is happening (or not).

我通常的粗略"调试方法 alert()和 console.log()似乎不可用.

My usual 'crude' debugging methods, alert() and console.log(), do not seem to be available.

是否可以从Angular应用程序中访问这些功能或类似的功能?

Is it possible to get access to these functions or something like them from within an Angular app?

下面的plnkr示例似乎显示了点击事件正在运行"-影响了组件中的对象-但我的函数调用了 alert()和 log()似乎被忽略了.

The plnkr example below seems to show the click event 'working' -- effecting objects in my component -- but my function calls to alert() and log() seem to be getting ignored.

话虽如此，当我调用一个可能不存在的函数时，是否有办法得到某种错误消息?Chrome控制台日志似乎未显示任何内容.

With that said, is there a way to get some kind of error message when I call a probably-nonexistent function? The Chrome console log does not seem to show anything.

https://embed.plnkr.co/Dvadi8mWlUqTUW865UsI/

我认为可能重复"的问题是相似的，但实际上并没有讨论标题中的alert()或log()，而且各种部分答案似乎通常适用于Angular 1.x和控制器--我没有控制器.

I think the 'possibly-duplicate' question is similar, but it does not not actually talk about alert() or log() in the title, and the various partial answers seem generally geared towards Angular 1.x and controllers -- I do not have a controller.

这个问题的一部分是-我需要控制器吗?看起来可能有一种简单的方法来修饰"我的应用程序，但是现在我只有模块和类，而没有显式的控制器.

So part of this question is -- do I need a controller? It looks like there might be an easy way to 'decorate' my app, but I only have modules and classes right now, no explicit controller.

谢谢.

我认为最好的答案是在底部-必须为"ng-click"提供一个表达式，而不是函数调用.

I think the best answer is at bottom -- 'ng-click' must be provided an expression, not a function call.

下面是一些格式正确的代码，以显示如何在Angular2中调用这些基本功能(对于那里的其他新手):

and here is some properly formatted code to show how to call these basic functions in Angular2 (for other newbies out there):

@Component({
    selector: 'app-root',
    templateUrl: './app.component.html',
    //template:`<h2>Hello, world</h2>` ,
    styleUrls: ['./app.component.css']
})
export class AppComponent {
    title = 'Quiz Tool';
    quiz = new Quiz();

    doAlert(){
        console.log('log: test log, yo...'); // black
        console.debug('debug: test log, yo...'); // blue
        console.warn('warn: test log, yo...'); // yellow
        console.info('info: test log, yo...'); // black (with 'i' icon)
        console.error('error: test log, yo...'); // red
        alert('test...');
    }
}

，然后从您的HTML中调用doAlert()方法:

and call the doAlert() method from your HTML:

<button (click)="doAlert();count = count + 1" ng-init="count=0">Increment</button>

谢谢！

推荐答案

ng-click必须调用一个表达式.AngularJS表达式无法直接访问诸如窗口，文档或位置之类的全局变量.此限制是有意的.它可以防止意外访问全局状态-细微错误的常见来源.

ng-click must be call an expression. AngularJS expressions do not have direct access to global variables like window, document or location. This restriction is intentional. It prevents accidental access to the global state – a common source of subtle bugs.

这篇关于可以从Angular ng-click表达式中调用"alert()"或"console.log()"吗?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！