Skip to content

Commit 685fa38

Browse files
committed
reviewed changes so far
1 parent 65526d5 commit 685fa38

19 files changed

+172
-205
lines changed

app/chapter-04/app.component.ts

Lines changed: 14 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ import { Customer } from './model';
1010
template: `
1111
<h1>{{customer.name}}</h1>
1212
13-
<p><i>{{customer.name}} is at {{customer.street}} in {{customer.city}} in the {{customer.region}} region.</i></p>
13+
<p><i>{{customer.name}} is at {{customer.address.street}} in {{customer.address.city}} in the {{customer.address.region}} region.</i></p>
1414
1515
<fieldset>
1616
<label>
@@ -27,39 +27,29 @@ import { Customer } from './model';
2727
<fieldset>
2828
<label>
2929
Street:
30-
<input [(ngModel)]="customer.street" placeholder="Street">
30+
<input [(ngModel)]="customer.address.street" placeholder="Street">
3131
</label>
3232
</fieldset>
3333
<fieldset>
3434
<label>
3535
City:
36-
<input [(ngModel)]="customer.city" placeholder="City">
36+
<input [(ngModel)]="customer.address.city" placeholder="City">
3737
</label>
3838
</fieldset>
3939
<fieldset>
4040
<label>
4141
State:
42-
<select [(ngModel)]="customer.state">
42+
<select [(ngModel)]="customer.address.state">
4343
<option>California</option>
4444
<option>Jalisco</option>
4545
<option>Quebec</option>
4646
</select>
4747
</label>
4848
</fieldset>
49-
<fieldset>
50-
<label>
51-
Country:
52-
<select [(ngModel)]="customer.country">
53-
<option>Canada</option>
54-
<option>Mexico</option>
55-
<option>USA</option>
56-
</select>
57-
</label>
58-
</fieldset>
5949
<fieldset>
6050
<label>
6151
Region:
62-
<select [(ngModel)]="customer.region">
52+
<select [(ngModel)]="customer.address.region">
6353
<option>East</option>
6454
<option>North</option>
6555
<option>South</option>
@@ -71,16 +61,16 @@ import { Customer } from './model';
7161
`,
7262
})
7363

74-
export class AppComponent {
75-
64+
export class AppComponent {
7665
customer: Customer = {
77-
id: 1,
78-
name: 'Alex Smith',
79-
street: '123 Main Street',
80-
city: 'Anytown',
81-
state: 'California',
82-
country: 'USA',
83-
region: 'West'
66+
id: 1,
67+
name: 'Alex Smith',
68+
address: {
69+
street: '123 Main Street',
70+
city: 'Anytown',
71+
state: 'California',
72+
region: 'West'
73+
}
8474
};
8575

8676
hideAddress = false;

app/chapter-04/model.ts

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,13 @@
11
export class Customer {
22
id: number;
33
name: string;
4+
address: Address;
5+
}
6+
7+
// Todo: put in own file
8+
export class Address {
49
street: string;
510
city: string;
611
state: string;
7-
country: string;
812
region: string;
913
}

app/chapter-05/app.component.html

Lines changed: 6 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<h1>{{customer.name}}</h1>
22

3-
<p><i>{{customer.name}} is at {{customer.street}} in {{customer.city}} in the {{customer.region}} region.</i></p>
3+
<p><i>{{customer.name}} is at {{customer.address.street}} in {{customer.address.city}} in the {{customer.address.region}} region.</i></p>
44

55
<fieldset>
66
<label>
@@ -17,44 +17,34 @@ <h3>Address:</h3>
1717
<fieldset>
1818
<label>
1919
Street:
20-
<input [(ngModel)]="customer.street" placeholder="Street">
20+
<input [(ngModel)]="customer.address.street" placeholder="Street">
2121
</label>
2222
</fieldset>
2323
<fieldset>
2424
<label>
2525
City:
26-
<input [(ngModel)]="customer.city" placeholder="City">
26+
<input [(ngModel)]="customer.address.city" placeholder="City">
2727
</label>
2828
</fieldset>
2929
<fieldset>
3030
<label>
3131
State:
32-
<select [(ngModel)]="customer.state">
32+
<select [(ngModel)]="customer.address.state">
3333
<option>California</option>
3434
<option>Jalisco</option>
3535
<option>Quebec</option>
3636
</select>
3737
</label>
3838
</fieldset>
39-
<fieldset>
40-
<label>
41-
Country:
42-
<select [(ngModel)]="customer.country">
43-
<option>Canada</option>
44-
<option>Mexico</option>
45-
<option>USA</option>
46-
</select>
47-
</label>
48-
</fieldset>
4939
<fieldset>
5040
<label>
5141
Region:
52-
<select [(ngModel)]="customer.region">
42+
<select [(ngModel)]="customer.address.region">
5343
<option>East</option>
5444
<option>North</option>
5545
<option>South</option>
5646
<option>West</option>
5747
</select>
5848
</label>
5949
</fieldset>
60-
</div>
50+
</div>

app/chapter-05/app.component.ts

Lines changed: 9 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -9,16 +9,17 @@ import { Customer } from './model';
99
styleUrls: ['app.component.css']
1010
})
1111

12-
export class AppComponent {
12+
export class AppComponent {
1313

1414
customer: Customer = {
15-
id: 1,
16-
name: 'Alex Smith',
17-
street: '123 Main Street',
18-
city: 'Anytown',
19-
state: 'California',
20-
country: 'USA',
21-
region: 'West'
15+
id: 1,
16+
name: 'Alex Smith',
17+
address: {
18+
street: '123 Main Street',
19+
city: 'Anytown',
20+
state: 'California',
21+
region: 'West'
22+
}
2223
};
2324

2425
hideAddress = false;

app/chapter-05/model.ts

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,13 @@
11
export class Customer {
22
id: number;
33
name: string;
4+
address: Address;
5+
}
6+
7+
// Todo: put in own file
8+
export class Address {
49
street: string;
510
city: string;
611
state: string;
7-
country: string;
812
region: string;
913
}

app/chapter-06-exercise-completed/app.component.html

Lines changed: 7 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -2,9 +2,7 @@ <h1>Customers</h1>
22
<p><i>Click to select a customer</i></p>
33

44
<ul>
5-
<li *ngFor="let cust of customers"
6-
(click)="customer = cust"
7-
[ngClass]="{selected: cust === customer}">
5+
<li *ngFor="let cust of customers" (click)="customer = cust" [ngClass]="{selected: cust === customer}">
86
{{cust.name}}
97
</li>
108
</ul>
@@ -13,7 +11,7 @@ <h1>Customers</h1>
1311

1412
<div *ngIf="customer">
1513
<h2>{{customer.name}}</h2>
16-
<p><i>{{customer.name}} is at {{customer.street}} in {{customer.city}} in the {{customer.region}} region.</i></p>
14+
<p><i>{{customer.name}} is at {{customer.address.street}} in {{customer.address.city}} in the {{customer.address.region}} region.</i></p>
1715

1816
<fieldset>
1917
<label>
@@ -32,40 +30,31 @@ <h3>Address:</h3>
3230
<fieldset>
3331
<label>
3432
Street:
35-
<input [(ngModel)]="customer.street" placeholder="Street">
33+
<input [(ngModel)]="customer.address.street" placeholder="Street">
3634
</label>
3735
</fieldset>
3836
<fieldset>
3937
<label>
4038
City:
41-
<input [(ngModel)]="customer.city" placeholder="City">
39+
<input [(ngModel)]="customer.address.city" placeholder="City">
4240
</label>
4341
</fieldset>
4442
<fieldset>
4543
<label>
4644
State:
47-
<select [(ngModel)]="customer.state">
45+
<select [(ngModel)]="customer.address.state">
4846
<!-- use *ngFor to list the states as options -->
4947
<option *ngFor="let state of states">{{state}}</option>
5048
</select>
5149
</label>
5250
</fieldset>
53-
<fieldset>
54-
<label>
55-
Country:
56-
<select [(ngModel)]="customer.country">
57-
<!-- use *ngFor to list the countries as options -->
58-
<option *ngFor="let country of countries">{{country}}</option>
59-
</select>
60-
</label>
61-
</fieldset>
6251
<fieldset>
6352
<label>
6453
Region:
65-
<select [(ngModel)]="customer.region">
54+
<select [(ngModel)]="customer.address.region">
6655
<option *ngFor="let region of regions">{{region}}</option>
6756
</select>
6857
</label>
6958
</fieldset>
7059
</div>
71-
</div>
60+
</div>

app/chapter-06-exercise-completed/app.component.ts

Lines changed: 32 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -13,56 +13,51 @@ export class AppComponent {
1313

1414
customers: Customer[] = [
1515
{
16-
id: 1,
17-
name: 'Alex Smith',
18-
street: '123 Main Street',
19-
city: 'Anytown',
20-
state: 'California',
21-
country: 'USA',
22-
region: 'West'
16+
id: 1,
17+
name: 'Alex Smith',
18+
address: {
19+
street: '123 Main Street',
20+
city: 'Anytown',
21+
state: 'California',
22+
region: 'West'
23+
}
2324
},
2425
{
25-
id: 2,
26-
name: 'Pierre Pasmal',
27-
street: '456 Rue de Main',
28-
city: 'Quebec City',
29-
state: 'Quebec',
30-
country: 'Canada',
31-
region: 'East'
26+
id: 2,
27+
name: 'Pierre Pasmal',
28+
address: {
29+
street: '456 Rue de Main',
30+
city: 'Quebec City',
31+
state: 'Quebec',
32+
region: 'East'
33+
}
3234
},
3335
{
34-
id: 3,
35-
name: 'Margarita Nadie',
36-
street: '789 Calle Principal',
37-
city: 'Guadalajara',
38-
state: 'Jalisco',
39-
country: 'Mexico',
40-
region: 'South'
36+
id: 3,
37+
name: 'Margarita Nadie',
38+
address: {
39+
street: '789 Calle Principal',
40+
city: 'Guadalajara',
41+
state: 'Jalisco',
42+
region: 'South'
43+
}
4144
},
42-
/*
43-
"The Great Chicago Fire" started October 8th, 1871,
44-
allegedly caused by lantern kicked over by a cow belonging to
45-
Katie O'Leary, living at 137 DeKoven Street, Chicago, Illinois.
46-
Add her to the customer list.
47-
*/
4845
{
49-
id: 4,
50-
name: 'Katie O\'Leary',
51-
street: '137 DeKoven Street',
52-
city: 'Chicago',
53-
state: 'Illinois',
54-
country: 'USA',
55-
region: 'Midwest'
46+
id: 4,
47+
name: 'Katie O\'Leary',
48+
address: {
49+
street: '137 DeKoven Street',
50+
city: 'Chicago',
51+
state: 'Illinois',
52+
region: 'Midwest'
53+
}
5654
},
5755
];
5856

5957
customer: Customer;
6058

6159
hideAddress = false;
6260

63-
/* Create an array of the same countries */
64-
countries = ['Canada', 'Mexico', 'USA'];
65-
6661
regions = ['East', 'Midwest', 'North', 'South', 'West'];
6762

6863
/* Create an array of states that includes previous states PLUS Illinois */
Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,13 @@
11
export class Customer {
22
id: number;
33
name: string;
4+
address: Address;
5+
}
6+
7+
// Todo: put in own file
8+
export class Address {
49
street: string;
510
city: string;
611
state: string;
7-
country: string;
812
region: string;
913
}

0 commit comments

Comments
 (0)