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>
The purpose of the ngOpen directive is to preserve the open attribute, as used with the details element.
From the 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
P.S. If you're looking to implement accordion or collapse functionality, I would recommend using Bootstrap UI which offers angular directives for both that work across all browsers.