The first visible view in Augury is the Component Tree, which shows loaded components. Selecting a component within the tree highlights the component's template within the browser. At the same time, additional information about the selected component is presented on the right side in the Properties tab. Let's select DataTableCrudComponent:
You see all the internal properties, inputs, and outputs. All the properties are editable. The next screenshot shows the properties of the Dialog component. The output property visibleChange is an event emitter. We can trigger the event emitter by setting the value to true and clicking on the button Emit. In response, the dialog becomes visible:
Next to the Properties tab is the Injector Graph, which displays the dependencies of components and services. If we select the DataTable component, the dependency of the DataTable and its ancestry chain to the root injector will be shown:
The circle symbols for services need to...
