Làm cách nào để tìm URL kiểu ảnh từ trong mẫu twig?

Tôi đang thực hiện một mẫu nút sử dụng một hình ảnh hai lần; một lần theo cách 'bình thường' (nghĩa là sử dụng kiểu hình ảnh được xác định trong cấu hình hiển thị của trường cho chế độ xem đó) và cái kia là thuộc tính hình ảnh nền css.

Tôi cần một trong hai điều:

1. (lý tưởng) một cách để lấy URL cho một kiểu hình ảnh khác nhau của cùng một hình ảnh.

2. một cách để lấy URL cho trường hình ảnh.

Tôi đang vật lộn để sử dụng dump()và kint()giúp mình trả lời. Cả hai đều xuất ra quá nhiều (nhờ các liên kết được nhúng đến "cha mẹ", v.v.) và dường như không có thông tin tôi cần. ví dụ: nhìn vào dump(content.field_image)đầu ra URL thực tế của hình ảnh không có ở đó (vậy nó đến từ đâu để có thể được hiển thị với {{ content.field_image }}?!). kint()mặt khác chết hoàn toàn nếu tôi chuyển một đối số cho nó và phiên bản cấp cao nhất lại quá lớn để điều hướng. Việc gỡ lỗi trở nên dễ dàng hơn nhiều với phptemplate + xdebug. (Có, tôi biết thật tốt khi chủ đề không thể bỏ cơ sở dữ liệu.)

Có câu trả lời cho (1) ngụ ý rằng bạn không thể làm điều đó , nhưng tôi không hiểu tại sao tôi không thể lấy URL hiện có trong (2)?

Bạn có thể lấy url kiểu ảnh trong hàm tiền xử lý và chuyển nó vào mẫu nút. (trong trường hợp của tôi, tôi cần ở cấp độ trang. Tôi đoán điều này sẽ vẫn hoạt động cho nút)

Một cái gì đó như thế này, với "myimagefield" là tên máy cho trường hình ảnh của bạn và "myimagestyle" là tên máy cho kiểu của bạn, cũng đảm bảo bạn bao gồm Entity \ ImageStyle.

use Drupal\image\Entity\ImageStyle;

/**
 * Implements hook_preprocess_page().
*/
function mytheme_preprocess_page(&$variables, $hook) {
  if ($variables['node']) {
    $node = $variables['node'];
    if($node->myimagefield[0]){
        $cover_image = $node->myimagefield[0]->entity->getFileUri();
        $image_url = ImageStyle::load('myimagestyle')->buildUrl($cover_image);
        $variables['my_image'] = $image_url;
    }
  }
}

Phần đầu tiên đã được trả lời trong câu hỏi được liên kết, nơi có mã làm thế nào để làm điều này. Để trả lời phần thứ hai của câu hỏi, bạn có thể truy cập hình ảnh gốc trong đối tượng nút:

{{ file_url(node.field_image.entity.uri.value) }}

Một nhận xét về content:

Trong một mẫu nút, trường hình ảnh trong contentchưa sẵn sàng để được hiển thị. Trường chứa cấu hình như thế nào sẽ được hiển thị và đối tượng trường chứa tất cả dữ liệu thô. Sau này, nó sẽ được đặt cùng nhau trong các trường mẫu, định dạng hình ảnh và mẫu hình ảnh. Đó là lý do bạn không tìm thấy url bạn đang tìm kiếm contenttại thời điểm này.

Trong mẫu nút, bạn có thể sử dụng các trường ở cấp cao nhất của mảng nội dung, ví dụ: hiển thị trường hình ảnh

{{ content.field_image }}

như được cấu hình trong chế độ xem.

Biên tập:

Có một bộ lọc mới trong mô-đun Twig Tweak . Bây giờ bạn có thể tạo url kiểu ảnh trong twig trực tiếp từ uri hoặc url của ảnh gốc:

{{ node.field_image.entity.uri.value | image_style('thumbnail') }} 

Cài đặt Mô-đun Twig Tweak https://www.drupal.org/project/twig_tweak

Và mô-đun này Twig Field https://www.drupal.org/project/twig_field_value

Nếu bạn đang sử dụng hình ảnh trường tải lên hình ảnh thông thường, hãy sử dụng điều này trong mẫu nút của bạn:

<img src="{{ node.field_regular_image.entity.uri.value | image_style('thumbnail') }} " >

Nếu bạn đang sử dụng hình ảnh tham chiếu thực thể, hãy sử dụng:

<img src="{{ file_url(content.field_global_image|field_target_entity.image.entity.uri.value | image_style('thumbnail'))}} " >