Question

说我有一个变量，我想在控制台中看到它的值。但在Angular中我不能只在我的模板中写{{ console.log(variable) }}。我必须在我的班级中重新创建这个功能，例如：

test.component.ts：

log(val) { console.log(val) }

然后我可以得到值：

test.component.html：

{{ log(variable) }}

那么为什么我不能只写{{ console.log(variable) }}？

Answer 1

问：为什么我不能只写{{console.log（variable）}}？

答：简短回答。因为内置功能console不是控件的$scope对象的一部分。

Answer 2

因此，在Angular（2/4）中，模板中唯一可访问的内容是属于相应组件类的范围内的内容 - 即。你可以说＆＃34; this.blah＆＃34;在ts。

因此，您实际上可以按照您的建议行事，但是您需要将控制台添加到组件的范围内：

@Component({
    selector: 'my-component',
    template: `This is my template {{console.log(variable)}}`
})
export class MyComponent {
    console = console;
    variable = 'yay';
}

（这里的关键是console = console;）

然后这将输出＆＃39;变量＆＃39;用文字＆＃39; yay＆＃39;到控制台 - 捕获的是每次表达式渲染时它都会这样做...这通常会很多次。所以它不是特别好的做法，但如果你只是调试就可以了。

Answer 3

这是因为console.log()是全局window对象的一部分，并且无法在模板中直接访问窗口对象。

每当角度引擎找到插值字符串{{}}时，它就会使用内置的interpolation服务，该服务基本上返回与表达式关联的作用域，并根据此返回的作用域计算该作用域中使用的变量。模板只能访问其范围内的属性。 window对象不属于组件/控制器的范围，因此不能直接使用。

希望它能清除你的困惑。

Answer 4

你应该使用一个功能

离。

$scope.log2=function(param){
   console.log(param);
}

然后在视图中使用函数

{{log2(variable)}}

为什么我们不能直接在Angular中使用console.log？

4 个答案: