{{did-insert}}, {{did-update}} and {{will-destroy}} API docs

[GavinJoyce]

part of #2

[rwjblue]

Lookin' good! I think we should also mention that the function is not bound to the template context by default, and show how the user might do that (e.g. via action or using ember-bind-helper).

[rwjblue]

Also, I'm happy to land PR's like this iteratively...

[GavinJoyce]

I think we should also mention that the function is not bound to the template context by default, and show how the user might do that (e.g. via action or using ember-bind-helper)

I've added a short section on using action to bind the component context. It would be nicer to provide a simple example of when to use this, I couldn't think of one though. Perhaps you have an example that I could borrow?

[rwjblue]

I think the "simplest" demo would be some sort of "refs" type thing:

<div {{did-insert (action this.setupSpecialSauceElement)}} class="special-sauce"></div>

Then using the element and this in that method (perhaps to setup some external DOM plugin e.g. tinymce, mobiledoc, etc).

[GavinJoyce]

Thanks, I tried to keep it as simple as possible so I added the following example:

---

By default, the executed function will be unbound. If you would like to access the component context in your function, use the action helper as follows:

<div {{did-insert (action this.incrementCount)}}>first</div>
<div {{did-insert (action this.incrementCount)}}>second</div>

<p>{{this.count}} elements were rendered</p>

export default Component.extend({
  @tracked count = 0;

  incrementCount() {
    this.count++;
  }
});

[GavinJoyce]

I've added docs for {{did-update}} and {{will-destroy}} too

[rwjblue]

Thank you!