angular2使用占卜angular2程序调试

占卜角专用Chrome调试插件

如题,在谷歌2016-12-8开发者大会上,angular2领袖给我们示范的angular2的特点,进入了同学,没有太多新的内容,只有一部分的我为之一震,Augury和Vue(对比现在,确实可以支持谷歌angular2下将更加活跃,我个人认为,2年后,我恐怕VUE无法竞争的),像角CLI,仍在测试阶段,有很多问题,但在一些地方有很方便的开发和调试,这里看到的是不是国内第Augury,我会先介绍一些,让大家尝尝鲜!

占卜的安装

HTTPS: / / / IO谶。角。



内容和步骤都在这里,很简单,那就是,Chrome应用经营城市搜索占卜,安装好了,是一个Chrome插件。

占卜的特点

1视图的组成结构与占卜

In my angular2 application, the structure is very simple, a major AppComponent and a dashboardComponent









运行应用程序,打开浏览器查看网页,并在开发工具看componenttree。我们可以清楚地看到appcomponent结构图。当悬停到达组件时,页面将显示相应的位置。





2查看单个组件的特定属性和方法





点击属性,你可以看到组件的方法和混凝土的性能,我用了一个angular2组件CodeMirror(angular2真的很好,即使这个组件,不知道Vue不是);我能看到上面的SQL模式选择,模式的属性在这里我设置为SQL回声CodeMirror;

3视觉显示组件关系





我codemirrorcomponent是引用的组件,这是参照下的仪表板,和路径是如图所示。





4看路由器结构

我的例子中,路由器的树,无法显示,没有理由的,随着占卜演示讲解。





结构很清楚,实在太大了。

这些路由器结构、组件结构有助于了解应用程序的结构是否存在问题。组件的特定方法和属性用于调试特定内容的逻辑。有时候,如果你想改变一个值来查看它,它可以直接在属性中改变。

以上是本文的全部内容,希望能对您有所帮助,希望大家多多支持。