aboutsummaryrefslogtreecommitdiffstats
path: root/docs/content/cookbook/helloworld.ngdoc
blob: ab4c337a1e17782e8f4abdcd241a2c7364143e8e (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
@workInProgress
@ngdoc overview
@name Cookbook: Hello World
@description

<doc:example>
 <doc:source>
  Your name: <input type="text" name="name" value="World"/>
  <hr/>
  Hello {{name}}!
 </doc:source>
 <doc:scenario>
   it('should change the binding when user enters text', function(){
     expect(binding('name')).toEqual('World');
     input('name').enter('angular');
     expect(binding('name')).toEqual('angular');
   });
 </doc:scenario>
</doc:example>

# Things to notice

Take a look through the source and note:

* The script tag that {@link guide.bootstrap bootstraps} the angular environment.
* The text {@link angular.widget.HTML input widget} which is bound to the greeting name text.
* No need for listener registration and event firing on change events.
* The implicit presence of the `name` variable which is in the root {@link angular.scope scope}.
* The double curly brace `{{markup}}`, which binds the name variable to the greeting text.
* The concept of {@link guide.data-binding data binding}, which reflects any changes to the
  input field in the greeting text.