1
00:00:00,000 --> 00:00:04,598
[MUSIC]

2
00:00:04,598 --> 00:00:10,170
Thời gian chuyển sang nhiệm vụ thứ ba trong khóa học này.

3
00:00:10,170 --> 00:00:13,410
Trong nhiệm vụ này, như bạn có thể đã mong đợi,

4
00:00:13,410 --> 00:00:17,190
chúng tôi sẽ xem xét các hình thức góc và quan sát.

5
00:00:17,190 --> 00:00:22,480
Đó là những gì chúng tôi đã học i n mô-đun đặc biệt này của khóa học.

6
00:00:22,480 --> 00:00:28,600
Trong bài tập này, bạn sẽ được thiết kế một hình thức

7
00:00:28,600 --> 00:00:33,440
trong chế độ xem chi tiết món ăn

8
00:00:33,440 --> 00:00:38,540
cho phép người dùng gửi bình luận của họ về một món ăn cụ thể.

9
00:00:39,640 --> 00:00:45,504
Bạn sẽ sử dụng các hình thức phản ứng góc để thiết kế các hình thức và

10
00:00:45,504 --> 00:00:50,127
bạn sẽ sử dụng các thay đổi giá trị quan sát được

11
00:00:50,127 --> 00:00:53,623
để bắt đầu xác nhận hình thức,

12
00:00:53,623 --> 00:00:59,147
giống như chúng tôi đã làm trong bài tập mà bạn vừa hoàn thành và

13
00:00:59,147 --> 00:01:04,109
bạn sẽ sử dụng một thành phần vật liệu góc mới được gọi là

14
00:01:04,109 --> 00:01:07,747
vật liệu góc Thành phần thanh trượt.

15
00:01:07,747 --> 00:01:13,987
Thành phần thanh trượt sẽ được sử dụng để nhập đánh giá cho

16
00:01:13,987 --> 00:01:19,050
món ăn bởi người nộp số.

17
00:01:20,230 --> 00:01:24,620
Hãy nhìn vào ba nhiệm vụ trong nhiệm vụ này một chút chi tiết hơn.

18
00:01:26,410 --> 00:01:31,760
Vì vậy, ở đây, tôi sẽ cho các bạn xem món ăn đầu tiên của họ từ thực đơn

19
00:01:31,760 --> 00:01:38,510
để minh họa cho các bạn ba nhiệm vụ cần phải hoàn thành trong nhiệm vụ này.

20
00:01:38,510 --> 00:01:43,238
Vì vậy, trong nhiệm vụ này, chúng tôi sẽ tạo ra một hình thức trong

21
00:01:43,238 --> 00:01:48,594
phần bình luận của thành phần chi tiết món ăn của bạn.

22
00:01:48,594 --> 00:01:51,579
Biểu mẫu chứa hai trường ở đây.

23
00:01:51,579 --> 00:01:55,122
Trường tên và trường nhận xét.

24
00:01:55,122 --> 00:02:00,570
Trong trường tên, tên của tác giả cho nhận xét sẽ được nhập bởi người dùng.

25
00:02:00,570 --> 00:02:04,406
Sau đó, trong trường nhận xét của họ là một khu vực văn bản,

26
00:02:04,406 --> 00:02:10,037
bạn sẽ cho phép tác giả nhập nhận xét mà họ muốn gửi.

27
00:02:10,037 --> 00:02:14,639
Ngoài ra, để có được đánh giá cho món ăn,

28
00:02:14,639 --> 00:02:22,010
chúng tôi sẽ sử dụng thành phần vật liệu góc này được gọi là thanh trượt vật liệu góc.

29
00:02:22,010 --> 00:02:23,730
Đối với thành phần thanh trượt này,

30
00:02:25,040 --> 00:02:30,260
một liên kết đến tài liệu được cung cấp trong các tài nguyên bổ sung.

31
00:02:30,260 --> 00:02:33,541
Thành phần thanh trượt khá đơn giản để tạo.

32
00:02:33,541 --> 00:02:38,788
Đối với thành phần thanh trượt này, bạn sẽ hiển thị các dấu đánh dấu như thế này.

33
00:02:38,788 --> 00:02:43,033
Vì vậy, bạn có thể thấy rằng bạn đã có một, hai, ba, bốn dấu đánh dấu và dấu

34
00:02:43,033 --> 00:02:46,300
thứ năm nằm ngay dưới ngón cái này.

35
00:02:46,300 --> 00:02:49,943
Vì vậy, và cũng khi bạn hiển thị chế độ xem ngón tay cái,

36
00:02:49,943 --> 00:02:54,346
nó sẽ hiển thị cắt trong đánh giá đã chọn như.

37
00:02:59,650 --> 00:03:06,047
Vì vậy, điều này phải được dán nhãn trong slide góc của thành phần mà bạn bao gồm

38
00:03:06,047 --> 00:03:12,252
vào phông chữ của họ và điều này sẽ cho phép bạn chọn đánh giá cho món ăn.

39
00:03:12,252 --> 00:03:15,820
Vì vậy, đây là nhiệm vụ đầu tiên của bạn trong nhiệm vụ này.

40
00:03:16,880 --> 00:03:22,530
Nhiệm vụ thứ hai của bạn là thêm xác thực biểu mẫu cho biểu mẫu này.

41
00:03:22,530 --> 00:03:28,589
Bây giờ hình thức này nên được tạo ra bằng cách sử dụng các phông chữ phản ứng góc và

42
00:03:28,589 --> 00:03:34,200
cũng sử dụng các thay đổi giá trị quan sát được để quan sát

43
00:03:34,200 --> 00:03:39,377
bất kỳ thay đổi đối với bất kỳ của các yếu tố điều khiển hình thức của mình.

44
00:03:39,377 --> 00:03:44,226
Và bất cứ khi nào

45
00:03:44,226 --> 00:03:48,831
có bất kỳ thay đổi xảy ra, bạn nên ngay lập tức bắt đầu xác nhận biểu mẫu bằng cách sử dụng các thay đổi giá trị quan sát được giống như cách chúng tôi đã làm trong bài

46
00:03:48,831 --> 00:03:52,730
tập bạn vừa hoàn thành trong bài học trước đó.

47
00:03:54,650 --> 00:03:59,370
Bây giờ, xác nhận mà bạn cần thực hiện là cả tên và

48
00:03:59,370 --> 00:04:02,020
nhận xét là trường bắt buộc.

49
00:04:02,020 --> 00:04:06,029
Hơn nữa, tên phải chứa ít nhất hai ký tự.

50
00:04:06,029 --> 00:04:11,671
Vì vậy, nếu tôi chỉ cần gõ vào một ký tự, sau đó bạn nên hiển thị một thông báo ở đây nói rằng,

51
00:04:11,671 --> 00:04:15,283
Tên tác giả phải có ít nhất hai ký tự dài.

52
00:04:15,283 --> 00:04:19,250
Bây giờ nếu tất nhiên, chúng tôi gõ nhiều hơn, sau đó nó sẽ biến mất.

53
00:04:19,250 --> 00:04:23,494
Nếu bạn loại bỏ hoàn toàn tên khỏi trường,

54
00:04:23,494 --> 00:04:28,760
sau đó bạn hiển thị một thông báo cho biết, Tên tác giả là bắt buộc.

55
00:04:28,760 --> 00:04:31,985
Vì vậy, thông báo cần thiết sẽ được hiển thị ở đây.

56
00:04:31,985 --> 00:04:35,327
Vì vậy, ngay sau khi tôi gõ ít nhất hai ký tự,

57
00:04:35,327 --> 00:04:38,610
sau đó tin nhắn sẽ biến mất.

58
00:04:38,610 --> 00:04:42,051
Bây giờ đối với trường nhận xét cũng, đây là trường bắt buộc.

59
00:04:42,051 --> 00:04:46,029
Vì vậy, bạn cần phải nhập ít nhất một vài ký tự.

60
00:04:46,029 --> 00:04:49,159
Không có giới hạn về số lượng ký tự.

61
00:04:49,159 --> 00:04:54,586
Nhưng nếu không có ký tự nào được gõ vào khi bạn hiển thị thông báo ở đây nói,

62
00:04:54,586 --> 00:04:56,980
bình luận theo yêu cầu.

63
00:04:56,980 --> 00:05:02,966
Nếu biểu mẫu của bạn hiện không hợp lệ, thì nút gửi của bạn sẽ không hoạt động.

64
00:05:02,966 --> 00:05:08,006
Nhưng một khi biểu mẫu của bạn trở nên hợp lệ, sau đó nút gửi của bạn sẽ hoạt động và sẽ

65
00:05:08,006 --> 00:05:10,707
cho phép bạn gửi phông chữ.

66
00:05:10,707 --> 00:05:15,160
Vì vậy, đó là nhiệm vụ thứ hai trong nhiệm vụ của anh.

67
00:05:16,170 --> 00:05:23,060
Nhiệm vụ khó khăn trong nhiệm vụ của bạn là ngay sau khi biểu mẫu có thông tin hợp lệ,

68
00:05:23,060 --> 00:05:28,240
bạn nên hiển thị bản xem trước những gì bạn vừa gửi trong biểu mẫu.

69
00:05:28,240 --> 00:05:33,310
Hãy để tôi gõ vào một cái gì đó có ý nghĩa hơn ở đây, để họ

70
00:05:33,310 --> 00:05:38,460
xem trước trông thú vị.

71
00:05:38,460 --> 00:05:43,550
Vì vậy, bạn thấy rằng ngay sau khi bạn nhập thông tin hợp lệ vào biểu mẫu của

72
00:05:43,550 --> 00:05:48,440
bạn, bạn nên hiển thị một bản xem trước của nhận xét sẽ

73
00:05:48,440 --> 00:05:53,210
trông như thế nào nếu nó được thêm vào danh sách nhận xét cho món ăn đó.

74
00:05:53,210 --> 00:05:57,712
Bây giờ hãy chú ý rằng trong bản xem trước, bạn chưa có ngày hiển thị.

75
00:05:57,712 --> 00:06:01,046
Vì vậy, đó là một điều khác mà bạn cần ghi nhớ.

76
00:06:01,046 --> 00:06:08,027
Nếu biểu mẫu trở nên không hợp lệ, thì bản xem trước sẽ biến mất.

77
00:06:08,027 --> 00:06:13,020
Nhưng ngay khi biểu mẫu trở nên hợp lệ, bản xem trước sẽ xuất hiện trở lại.

78
00:06:13,020 --> 00:06:18,850
Vì vậy, đây là một cái gì đó mà bạn nên thiết kế thích hợp bằng cách sử dụng danh sách ND và

79
00:06:18,850 --> 00:06:26,190
sau đó đảm bảo rằng biểu mẫu là hợp lệ trước khi bạn hiển thị thông tin này ở đó.

80
00:06:26,190 --> 00:06:27,044
Vì vậy, đó là bản xem trước.

81
00:06:27,044 --> 00:06:30,676
Bây giờ khi người dùng nhấp vào nút Gửi,

82
00:06:30,676 --> 00:06:34,370
sau đó có một vài điều mà bạn cần phải làm.

83
00:06:34,370 --> 00:06:39,344
Khi người dùng nhấp vào nút Gửi, sau đó nhận xét này sẽ được

84
00:06:39,344 --> 00:06:44,589
thêm vào danh sách nhận xét mà bạn có cho món ăn đặc biệt này.

85
00:06:44,589 --> 00:06:50,943
Vì vậy, hãy để tôi nhấp vào nút gửi và bạn sẽ ngay lập tức nhận thấy rằng biểu mẫu

86
00:06:50,943 --> 00:06:56,490
đã được thêm vào danh sách nhận xét cho món ăn đặc biệt này.

87
00:06:56,490 --> 00:07:01,349
Vì vậy, bạn thấy rằng bình luận cuối cùng mà tôi vừa nhập đã được thêm vào ở đây.

88
00:07:01,349 --> 00:07:05,632
Cũng lưu ý rằng ngày cho

89
00:07:05,632 --> 00:07:13,140
biểu mẫu đã được thêm vào bình luận ở đây.

90
00:07:13,140 --> 00:07:18,612
Vì vậy, bạn có nghĩa vụ phải lấy các giá trị từ mô hình biểu mẫu và

91
00:07:18,612 --> 00:07:24,084
sau đó sao chép nó vào một mô hình dữ liệu, và sau đó bạn đẩy bình luận

92
00:07:24,084 --> 00:07:30,009
vào tia đối tượng JavaScript nhận xét cho đối tượng món ăn.

93
00:07:30,009 --> 00:07:34,553
Vì vậy, đó là một cái gì đó mà bạn cần phải làm bằng cách sử dụng phương pháp đẩy mảng cho

94
00:07:34,553 --> 00:07:36,960
mảng đối tượng JavaScript.

95
00:07:36,960 --> 00:07:41,534
Hơn nữa, ngày nên được tự động cấu hình và

96
00:07:41,534 --> 00:07:43,574
thêm vào mô hình dữ liệu đó.

97
00:07:43,574 --> 00:07:48,510
Hãy nhớ rằng mô hình biểu mẫu không chứa ngày, nhưng

98
00:07:48,510 --> 00:07:54,800
mô hình dữ liệu có nguồn gốc từ lớp bình luận mà chúng tôi đã thiết kế,

99
00:07:54,800 --> 00:08:01,500
mô hình dữ liệu chứa tác giả, đánh giá, bình luận và ngày.

100
00:08:01,500 --> 00:08:05,642
Vì vậy, bạn cần phải thêm ngày vào mô hình dữ liệu.

101
00:08:05,642 --> 00:08:11,261
Vì vậy, đây là nơi bạn sẽ sử dụng các

102
00:08:11,261 --> 00:08:16,370
lớp Java Script date cùng với chuyển đổi nó thành một

103
00:08:16,370 --> 00:08:24,060
chuỗi ISO trước khi bạn lưu trữ vào trường ngày của mô hình dữ liệu nhận xét của bạn.

104
00:08:24,060 --> 00:08:29,164
Bây giờ tôi đã cung cấp cho bạn các liên kết đến ví dụ về cách bạn có thể

105
00:08:29,164 --> 00:08:34,268
tạo ngày và làm thế nào bạn cab chuyển đổi ngày thành một

106
00:08:34,268 --> 00:08:39,148
chuỗi ISO trong tài liệu cho nhiệm vụ này,

107
00:08:39,148 --> 00:08:44,158
và cũng trong các nguồn lực bổ sung cho mục này.

108
00:08:44,158 --> 00:08:48,904
Vì vậy, xin vui lòng tìm kiếm để hiểu làm thế nào bạn phải

109
00:08:48,904 --> 00:08:52,530
thêm ngày vào trường nhận xét đó ở đó.

110
00:08:52,530 --> 00:08:56,989
Và một khi nhận xét được đẩy vào mảng nhận xét,

111
00:08:56,989 --> 00:09:02,176
sau đó nó sẽ tham gia phần còn lại của nhận xét cho món ăn cụ thể đó.

112
00:09:02,176 --> 00:09:06,600
Bạn phải nhớ rằng chúng tôi không lưu điều này vào phía máy chủ,

113
00:09:06,600 --> 00:09:09,129
bởi vì chúng tôi không có một phía máy chủ.

114
00:09:09,129 --> 00:09:13,330
Vì vậy, nếu bạn tải lại trang của mình, nhận xét đó sẽ biến mất.

115
00:09:13,330 --> 00:09:15,040
Điều đó hoàn toàn chấp nhận được.

116
00:09:15,040 --> 00:09:19,417
Ở giai đoạn này, chúng tôi không cố gắng lưu những thay đổi cho

117
00:09:19,417 --> 00:09:23,810
món ăn trở lại máy chủ thông qua dịch vụ món ăn của chúng tôi.

118
00:09:23,810 --> 00:09:27,542
Điều đó chúng ta sẽ làm trong một trong những chu kỳ sau.

119
00:09:27,542 --> 00:09:31,811
Vì vậy, tại thời điểm này, nếu bạn tải lại trang này, nhận xét mà bạn chỉ cần nhập sẽ

120
00:09:31,811 --> 00:09:35,240
biến mất, nhưng điều đó hoàn toàn chấp nhận được.

121
00:09:35,240 --> 00:09:38,670
Vì vậy, đây là nhiệm vụ thứ ba trong nhiệm vụ của bạn.

122
00:09:39,720 --> 00:09:45,197
Sau khi bạn hoàn thành tất cả ba nhiệm vụ, hãy chắc chắn rằng tất cả mọi thứ hoạt động

123
00:09:45,197 --> 00:09:50,602
chính xác trước khi bạn gửi giải pháp gán cho hệ thống của họ.

124
00:09:50,602 --> 00:09:54,269
[ NHẠC]