Blade template - Hiển thị dữ liệu (Displaying data)

Nội dung bài học này chúng ta tìm hiểu về hiển thị dữ liệu (Displaying data) trong Blade template các bạn nhé!

1. Cú pháp hiển thị dữ liệu (Displaying data)

Chúng ta có thể hiện thị dữ liệu được truyền đến blade view bằng cách đặt biến đó giữa cặp {{ }}, ví dụ mình đăng ký một route:

routes/web.php

Route::get('/', function() {
    return view('home', ['name' => 'Pham Nhan']);
});

Tiếp đó các bạn tạo blade view home và code nó như sau:

resources/views/home.blade.php

Welcome, {{ $name }}

Đây là kết quả chúng ta thu được:

Cú pháp này vô cùng ngắn gọn phải không nào. So sánh với cách hiển thị $name trước kia:

Welcome, 

Lưu ý: Chúng ta chỉ có thể sử dụng các cú pháp của Blade template khi đuôi mở rộng có dạng .blade.php.

2. Displaying unescaped data

Giờ các bạn thử chèn cặp thẻ cho giá trị $name như thế này:

routes/web.php

Route::get('/', function() {
    return view('home', ['name' => 'Pham Nhan']);
});

Đoán xem chữ "Pham Nhan" có được in đậm không? Đáp án là "Không". Vì cú pháp {{ }} trước khi hiển thị dữ liệu thì nó đã đưa qua hàm htmlspecialchars, việc này sẽ tránh các cuộc tất công XSS. Nói một cách đơn giản thì kiểu tấn công này lợi dụng việc có thể hiển thị các thẻ HTML thông qua chức năng viết bài, comment... để chèn mã script độc, tấn công hệ thống.

Vậy nếu giờ bạn muốn chèn HTML vào dữ liệu của mình thì sao? Laravel không tuyệt đường bất kỳ mong muốn nào của coder cả, họ cung cấp cho chúng ta cú pháp {!! ... !!} để có thể hiển thị cả mã HTML.

resources/views/home.blade.php

Welcome, {!! $name !!}

Kết quả:

Lưu ý: Để tránh bị tân công XSS, bạn nên dùng cú pháp này show các dữ liệu do bạn xác định, admin cpanel xác định chứ không nên show các dữ liệu do người dùng nhập như viết bài, comment... để tránh chèn mã độc.

Cú pháp {{ }} không giới hạn việc hiển thị dữ liệu của biến truyền vào blade view. Bạn có thể echo kết quả bất kì hàm PHP nào, chẳng hạn như:

The current UNIX timestamp is {{ time() }}.

3. Rendering JSON

Nếu bạn truyền một mảng đến blade view và muốn render nó như một JSON để gán giá trị cho biến nào đó trong đoạn mã script. Thông thường với PHP, bạn sẽ:

Nhưng đối với Blade template Laravel thì cú pháp sẽ gọn đi rất nhiều. Thay vì gọi thủ công như thế thì ta có thể sử dụng cú pháp @json, nó sẽ nhận các tham số tương tự như json_encode.
Nếu như bạn truyền @json trong một thuộc tính của thẻ thì nên để trong nó trong cặp dấu ''.
4. Blade & JavaScript Frameworks
Có một số Javascript framework sử dụng cặp {} làm cú pháp của mình, chính vì thế đôi khi Blade template sẽ hiểu nhầm là cú pháp của nó và compile, có thể gây lỗi. Để tránh điều đó, bạn chỉ cần thêm ký tự @ trước câu lệnh thì Blade template sẽ hiểu nó không phải là cú pháp cần compile.
resources/views/home.blade.php
Welcome, @{{ $name }}
và đây là kết quả:
Trườn hợp nhiều câu lệnh Javascript framework có chứa cặp {} Laravel cung cấp cho chúng ta một giải pháp đó chính là đưa tất cả các cú pháp Javascript framework ấy vào trong cặp thẻ @verbatim ... @endverbatim như thế này:
@verbatim
{{ $variable }}
//...
@endverbatim
5. Lời kết:
Vậy là chúng ta đã tìm hiểu xong về hiển thị dữ liệu (Displaying data) trong Blade template rồi đấy. Bài sau chúng ta sẽ tiếc tục tìm hiểu cấu trúc điều khiển (Control structure) trong  Blade template các banh nhé. CHÚC các bạn học tốt!