The *purpose* of the `ngOpen` directive is to preserve the [open attribute][open], as used with the [details element][details].

From the [docs][docs]:

>The HTML specification does not require browsers to preserve the values of boolean attributes such as open. (Their presence means true and their absence means false.) If we put an Angular interpolation expression into such an attribute then the binding information would be lost when the browser removes the attribute. The ngOpen directive solves this problem for the open attribute. This complementary directive is not removed by the browser and so provides a permanent reliable place to store the binding information.

Neither `open` nor `details` are specific to angular.  This is perfectly valid html:

    <details open>
        <summary>Section Header</summary>
        Section Content
    </details>

Angular just added ngOpen to help with binding.

**Note**: This is an experimental feature and is [not supported in all browsers][support]

**P.S.** If you're looking to implement *accordion* or *collapse* functionality, I would recommend using [**Bootstrap UI**][Bootstrap UI] which offers angular directives for both that work across all browsers.

[docs]: https://docs.angularjs.org/api/ng/directive/ngOpen
[open]: https://developer.mozilla.org/en-US/docs/Mozilla/Tech/XUL/Attribute/open
[details]: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/details
[support]: http://caniuse.com/details
[Bootstrap UI]: http://angular-ui.github.io/bootstrap

What is the point of the AngularJS directive ngOpen aside from using it with the details tag?

I'm trying to create an accordion component and this came up but not sure exactly if it helps considering I haven't been able to use it with anything other than the details tag.

    <body ng-app="">
        Check me check multiple: <input type="checkbox" ng-model="open"><br/>
      <details id="details" ng-open="open">
         <summary>Show/Hide me</summary>
      </details>
    </body>