How to build a paper-element app with dart?

Question

I want to build a large application in Dart using material design. To accomplish this I included paper_elements into my project. My problem is, that I can't think of a good way to build my multi page application with paper_elements. Usually I create objects which would create their elements inline and add / remove themselves to the dom. The way I understand the paper_element tutorials I found so far this is not possible with them.

Is there a simple way to use paper_elements in dart while having an object based structure? For example I would have my application which loads either a register or login object and displays it in the browser. When logging in it should load a menu object which displays a menu and so on. All page changes should happen without a page reload.

I'm looking forward to all help, examples or links you could provide regarding my problem.

Cheers, Tim

Answer 1

In Dart you normally build the app as SPA (single page application) without reload. You can add remove a paper-element like normal DOM elements (div, input, ...) querySelector('#placeholder').append(new Element.tag('paper-input')); You can also use <template if="{{}}"> or <template repeat="{{}}"> to make Polymer auto-insert these elements when certain conditions are fulfilled or for each value in a collection.

Your question isn't very specific but I guess all you need is already available here on SO as Q/A. Just search for [dart-polymer]. If you don't find anything just ask and we point you in the right direction.

a few that might be relevant

• Dart Language: Polymer - Working with views
• How to update polymer element bindings after it was removed from DOM and inserted again
• How to add attributes to a dynamically created component
• how to implement a main function in polymer apps (you don't need a main() when you use a polymer-element that acts as a container for your entire application)
• Is imperative Mustache-Binding in Polymer.dart supported?