小编Pet*_*ith的帖子

我试图测试我的ng-click绑定是否有效 - 但我似乎遇到了一个更基本的问题 - 如何看待发生了什么(或不发生).

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

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

下面的plnkr示例似乎显示了click事件'working' - 在我的组件中影响对象 - 但是我的函数调用alert()并且log()似乎被忽略了.

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

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

我认为"可能重复"的问题是类似的,但它实际上并没有在标题中谈论alert()或log(),而且各种部分答案似乎通常面向Angular 1.x和控制器 - 我这样做没有控制器.

所以这个问题的一部分是 - 我需要一个控制器吗？看起来可能有一种简单的方法来"装饰"我的应用程序,但我现在只有模块和类,没有明确的控制器.

谢谢.

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

这里有一些格式正确的代码,用于说明如何在Angular2中调用这些基本函数(对于其他新手):

@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 …

我正在构建本质上类似于Duolingo（SPA风格）的QuizTool / LMS。

tldr：依次单击plnkr，“ Check Answers”，“ Do Another”，然后注意第一个输入元素不再具有输入焦点-即使“ autofocus”属性似乎设置正确。我可以解决这个问题吗？

https://embed.plnkr.co/DU8opUuquP5MXlcfdHIe/

加长版：当我第一次进行测验时，我可以将输入焦点（使用绑定autofocus属性）设置到屏幕上的第一个输入区域（一个TEXTAREA，用户将在其中回答第一个问题）-这样用户可以刚开始打字。优秀。

但是，一旦用户提交了第一组问题（第一个测验），用户就可以选择“再做一次”测验-I / Angular能够重绘新的测验/ UI（到目前为止，发生了什么情况） （完全相同的问题），只有'autofocus'属性似乎不起作用-即第一个输入/文本区域没有获得焦点。

看来autofocus确实设置了bound 属性。

这意味着：1）我以某种方式错误地读取了属性2）它是Chrome中的错误（Mac OSX上的版本56.0.2924.87（64位））3）在此字段的自动对焦正确后，某些东西正在获取/窃取焦点设置4）等

我在ngFor循环中设置了“ firstQuestion”和“ lastQuestion”本地变量，以帮助证明已确定地设置了autofocus属性（只需将更[autofocus]="firstQuestion"改为[autofocus]="lastQuestion"）。

我愿意解决此问题，但我需要这样做。整个“无控制器”的东西对我来说还是很新的，因此很可能我在整个设置中都做了一些愚蠢的事情。

我尝试使用Angular表单/ ngForm，但似乎没有什么不同。

我也很想知道我在哪里可以找到有关Angular2 Transitions /'controller'的基本教程，即如何重绘屏幕或切换到新视图等，而又没有发现什么呢？ “传统”控制器。我认为使用VB时您会说：

oldForm.hide(); newForm.show();

如果这些都不起作用，我想手动设置焦点/ jqLit​​e / HTML5之前的版本/无论如何-那里都还没有取得很大的成功-因此出现了这个问题。

谢谢。

不确定这有什么用处，但似乎我的应用程序（由ng cli工具设置）与plunkr产生的应用程序有很大不同。

我发现了：

1. 即使'document.activeElement'设置为正确的文本区域（根据查询DOM），对于用户开始输入文本，它仍然可能未被激活（我设置了红色bg使其非常直观），并且

2. 组件加载完成后，外部/托管index.html页（如下所示）成为焦点。我添加了一个hack javascript函数，将焦点手动推回所需的元素，但这实际上只是用于测试。

   <script>
        setInterval(function(){ 
           if(document.activeElement!=null){
               if(document.activeElement.id!='textarea-0'){ // find first input element on the page
                   document.getElementById('textarea-0').focus(); // set the focus
               }
           } 
       },
       5000);                
   </script>
   

   Run Code Online (Sandbox Code Playgroud)

更新：

固定。再次感谢@mickdev。

这是第一个解决方案的小转折。我将其描述为“在要呈现的组件上将模板引用变量与ngAfterViewChecked（）生命周期方法一起使用”。 …