angular.dart.ui
angular.dart.ui copied to clipboard
Published
20 hours ago •
akserg
akserg
Accordion render issue when initialized off screen
I been having an issue using accordions inside different tabs. The accordion in initially active tab work as expected but the nonactive tabs contain non-functioning accordions. They don't open right nor close right.
Spent some time trying to figure out but I'm new to dart, angular and angular-ui. To much is a back box at this point to be of much service. But bellow is code that demonstrates the issue in the least amount of code I could mange.
test.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="packages/angular_ui/css/angular.css">
<title>test</title>
</head>
<body>
<div style="padding: 10px 10px 10px 10px;">
<tabset>
<tab heading="Test" active="true" >
<div >
<div >
<accordion >
<accordion-group >
<accordion-heading>
Configured
</accordion-heading>
This is just some content to illustrate fancy headings.
</accordion-group>
</accordion>
</div>
</div>
</tab>
<tab heading="Test2" active="false" >
<div >
<div >
<accordion >
<accordion-group >
<accordion-heading>
Configured
</accordion-heading>
This is just some content to illustrate fancy headings.
</accordion-group>
</accordion>
</div>
</div>
</tab>
</tabset>
</div>
<script type="application/dart" src="test.dart"></script>
<!-- for this next line to work, your pubspec.yaml file must have a dependency on 'browser' -->
<script src="packages/browser/dart.js"></script>
</body>
</html>
test.dart
import 'package:angular/application_factory.dart';
import 'package:angular_ui/angular_ui.dart';
void main() {
applicationFactory()
.addModule(new AngularUIModule()) // The angular-ui module
.run();
}
