104 lines
		
	
	
		
			1.9 KiB
		
	
	
	
		
			Plaintext
		
	
	
	
	
	
			
		
		
	
	
			104 lines
		
	
	
		
			1.9 KiB
		
	
	
	
		
			Plaintext
		
	
	
	
	
	
| 
 | |
| p.location-badge.
 | |
|   exported from <a href="/angular2/forms.html">angular2/forms</a>
 | |
|   defined in <a href="https://github.com/angular/angular/tree/master/modules/angular2/src/forms/directives.js#L210">angular2/src/forms/directives.js (line 210)</a>
 | |
| 
 | |
| :markdown
 | |
|   Binds a control group to a DOM element.
 | |
|   
 | |
|   # Example
 | |
|   
 | |
|   In this example, we bind the control group to the form element, and we bind the login and password controls to the
 | |
|   login and password elements.
 | |
|   
 | |
|   Here we use <a href="FormDirectives-var.html"><code>FormDirectives</code></a>, rather than importing each form directive individually, e.g.
 | |
|   `ControlDirective`, `ControlGroupDirective`. This is just a shorthand for the same end result.
 | |
|   
 | |
|    ```
 | |
|   @Component({selector: "login-comp"})
 | |
|   @View({
 | |
|        directives: [FormDirectives],
 | |
|        inline: "<form [control-group]='loginForm'>" +
 | |
|                "Login <input type='text' control='login'>" +
 | |
|                "Password <input type='password' control='password'>" +
 | |
|                "<button (click)="onLogin()">Login</button>" +
 | |
|                "</form>"
 | |
|        })
 | |
|   class LoginComp {
 | |
|    loginForm:ControlGroup;
 | |
|   
 | |
|    constructor() {
 | |
|      this.loginForm = new ControlGroup({
 | |
|        login: new Control(""),
 | |
|        password: new Control("")
 | |
|      });
 | |
|    }
 | |
|   
 | |
|    onLogin() {
 | |
|      // this.loginForm.value
 | |
|    }
 | |
|   }
 | |
|   
 | |
|    ```
 | |
|   
 | |
| .l-main-section
 | |
|   h2 Members
 | |
|   .l-sub-section
 | |
|     h3 constructor
 | |
| 
 | |
|     
 | |
|     pre.prettyprint
 | |
|       code.
 | |
|         constructor(groupDirective:ControlGroupDirective)
 | |
|     
 | |
|     :markdown
 | |
|       
 | |
| 
 | |
| 
 | |
| 
 | |
| 
 | |
|   .l-sub-section
 | |
|     h3 addDirective
 | |
| 
 | |
|     
 | |
|     pre.prettyprint
 | |
|       code.
 | |
|         addDirective(c:ControlDirective)
 | |
|     
 | |
|     :markdown
 | |
|       
 | |
| 
 | |
| 
 | |
| 
 | |
| 
 | |
| 
 | |
|   .l-sub-section
 | |
|     h3 controlGroup
 | |
| 
 | |
|     
 | |
|     pre.prettyprint
 | |
|       code.
 | |
|         controlGroup(controlGroup)
 | |
|     
 | |
|     :markdown
 | |
|       
 | |
| 
 | |
| 
 | |
| 
 | |
| 
 | |
| 
 | |
|   .l-sub-section
 | |
|     h3 findControl
 | |
| 
 | |
|     
 | |
|     pre.prettyprint
 | |
|       code.
 | |
|         findControl(name:string)
 | |
|     
 | |
|     :markdown
 | |
|       
 | |
| 
 | |
| 
 | |
| 
 | |
| 
 |