Binding to a selected field

In this recipe, we will show you how to bind a selected value from a <select> tag to a variable; so in effect, we now perform data binding from the UI to the code and have two-way data binding. We show a list of companies. You can find the code in the project pol_select.

How to do it...

1. The script starts with web\index.html, where a component with the name pol-select is imported through the following line:

   <link rel="import"href="pol_select.html">

   From this, we know that the component is defined in pol_select.html, and the code behind it is in a file named pol_select.dart. For a discussion of the other tags, see the first recipe.

2. The code for pol-select is defined in pol_select.dart:

   import'package:polymer/polymer.dart';
   
   @CustomTag('pol-select')
   classPolselect extends PolymerElement {
     final List companies = toObservable(['Google', 'Apple',   'Mozilla', 'Facebook']);
     @observable...