View models

A view model is an abstraction of the view exposing public properties and commands. It allows developers to offload features and business logic from block classes into separate classes that are easier to maintain, test, and reuse.

When to use view models

Use this approach anytime you need to inject functionality into template files and your code does not need to be backwards compatible with Magento 2.1.

View models are available in Magento 2.2 onwards. If your code must be compatible with older versions of Magento, consider adding your logic to blocks. For more information about backward compatibility, see Backward compatibility.

How to write view models

View models can be used by passing the view model class as an argument to a template’s block in the page layout configuration file. In the following example snippet, MyNewViewModel is the view model class of the OrangeCompany_Catalog module passed as an argument to a block.

1
2
3
4
5
<block name="orangeco.new.viewmodel" template="OrangeCompany_Catalog::example.phtml">
    <arguments>
        <argument name="view_model" xsi:type="object">OrangeCompany\Catalog\ViewModel\MyNewViewModel</argument>
    </arguments>
</block>

In the following example, the same view model is used with an existing block in Magento/Checkout/view/frontend/layout/checkout_cart_item_renderers.xml.

1
2
3
4
5
<referenceBlock name="checkout.cart.item.renderers.default">
    <arguments>
        <argument name="view_model" xsi:type="object">OrangeCompany\Catalog\ViewModel\MyNewViewModel</argument>
    </arguments>
</referenceBlock>

The view model class must always implement the interface \Magento\Framework\View\Element\Block\ArgumentInterface. For example:

1
2
3
4
5
6
7
8
9
namespace OrangeCompany\Catalog\ViewModel;

class MyNewViewModel implements \Magento\Framework\View\Element\Block\ArgumentInterface
{
    public function getTitle()
    {
      return 'Hello World';
    }
}

You can access the public methods for the view model class in the template:

1
2
3
4
5
6
7
8
<?php

/** @var $viewModel \OrangeCompany\Catalog\ViewModel\MyNewViewModel */

$viewModel = $block->getViewModel();

?>
<h1><?= $block->escapeHtml($viewModel->getTitle()); ?></h1>

Examples of View models in Magento

• Magento Theme. This view_model is injected into a template to return the target store redirect url.