title: What is the proper ember.js-way to react to a changing checkbox
body: <p>I have a checkbox like this:</p>
  
  <pre><code>{{input type="checkbox" checked=property}}
  </code></pre>
  
  <p>When I click the checkbox the property is changed. Now I like to call a function to persist the property. But what is the best way to do this?</p>
  
  <ol>
  <li>I could bind an observer to property, <a href="https://guides.emberjs.com/release/object-model/observers/" rel="nofollow noreferrer">but this is consindered bad.</a></li>
  <li><p>I could bind an action to input oder click.</p>
  
  <pre><code>{{input ... input=(action "actionName") click=(action "actionName")}}
  </code></pre>
  
  <p>This doesn't work because the property has still the old value when the action is called.</p></li>
  <li><p>Extending the class Checkbox:</p>
  
  <pre><code>import Checkbox from '@ember/component/checkbox';
  Checkbox.reopen({
      onChange: null,
      change() {
          this._super();
          if (this.onChange) this.onChange();
      }
  });
  ...
  {{input ... onChange=(action "actionName")}}
  </code></pre>
  
  <p>But the function change <a href="https://api.emberjs.com/ember/3.9/classes/Checkbox?show=inherited%2Cprotected%2Cprivate%2Cdeprecated" rel="nofollow noreferrer">is not documented</a>, even though <a href="https://github.com/emberjs/ember.js/blob/83263728b116fac6d4e8fcc798babf555a62ac2b/packages/%40ember/-internals/glimmer/lib/components/checkbox.ts" rel="nofollow noreferrer">the source code </a> indicates that it is feasable to override.</p></li>
  <li><p>I could bind an action to didUpdate or didUpdateAttrs, but the action is called twice. In my case this wouldn't be a problem, because the property is part of a model, so I could call <code>model.get('hasDirtyAttributes')</code> in the action.
  <strong>[Update]</strong> In my test case the action was called twice but in my real code it is only called once, so this seems to be the best solution?<strong>[/Update]</strong></p></li>
  </ol>
  
  <p>So what is the proper ember.js-way to do this?</p>