Update Lifecycle-Hooks

[genesistms]

Would like to update Lifecycle page.

Todo

• [x] Deprecate OnChanges to AfterChangse (https://github.com/angulardart-community/site-angulardart/pull/40)
• [x] Migrate examples to latest angular
• [x] Change image hooks-in-sequence.png
• [x] Recreate gif for AfterChanges example. (https://github.com/angulardart-community/site-angulardart/pull/44)

... please comment what changes you would like ...

Ideas

• More obvious examples. Better visualization of gifs -> add colors, etc.
• Make more visible where is the line where host view can be modified. (eg, in image of hooks-in-sequence.png)
• Better explain why DoCheck is called so many times. What change detection cycle means.

This can be confusing to users:

Detect and act upon changes that Angular can’t or won’t detect on its own

What are these undetectable changes.

• Mention ChangeDetectionStrategy.
• Or create follow up article only about change detector and what means when component is dirty. (some examples are in markForCheck and markChildForCheck reference pages.)

[insinfo]

@GenesisTMS I think it's really good to talk about "ChangeDetectionStrategy" because there is little documentation about it. And I think it's very important to also talk about creating custom UI components, with simple examples of Custom Button , Selects, Inputs, DataTables etc, this would help many newbie developers, I had to learn about it by analyzing the source code of many components made in Angular TypeScript or even done with old versions of AngularDart, it was quite difficult.

[genesistms]

@GZGavinZhao This issue can be closed. I will eventually create issues based on additional ideas.

And migration page can be updated.