1

I want to list category block By knockoutjs. Currently I Implemented By Direct PHP Code But I want to do by Knockout js.

My Block code
----------
namespace QuickLearn\Knockout\Block;
class CategorisCollection extends \Magento\Framework\View\Element\Template
{
     protected $_categoryHelper;
     protected $categoryFlatConfig;
     protected $topMenu;
    /**
     * @param \Magento\Framework\View\Element\Template\Context $context
     * @param \Magento\Catalog\Helper\Category $categoryHelper
     * @param array $data
     */
    public function __construct(
        \Magento\Framework\View\Element\Template\Context $context,
        \Magento\Catalog\Helper\Category $categoryHelper,
        \Magento\Catalog\Model\Indexer\Category\Flat\State $categoryFlatState,
        \Magento\Theme\Block\Html\Topmenu $topMenu
    ) {
        $this->_categoryHelper = $categoryHelper;
        $this->categoryFlatConfig = $categoryFlatState;
        $this->topMenu = $topMenu;
        parent::__construct($context);
    }
    /**
     * Return categories helper
     */   
    public function getCategoryHelper()
    {
        return $this->_categoryHelper;
    }
    /**
     * Return top menu html
     * getHtml($outermostClass = '', $childrenWrapClass = '', $limit = 0)
     * example getHtml('level-top', 'submenu', 0)
     */   
    public function getHtml()
    {
        return $this->topMenu->getHtml();
    }
    /**
     * Retrieve current store categories
     *
     * @param bool|string $sorted
     * @param bool $asCollection
     * @param bool $toLoad
     * @return \Magento\Framework\Data\Tree\Node\Collection|\Magento\Catalog\Model\Resource\Category\Collection|array
     */    
   public function getStoreCategories($sorted = false, $asCollection = false, $toLoad = true)
    {
        return $this->_categoryHelper->getStoreCategories($sorted , $asCollection, $toLoad);
    }
    /**
     * Retrieve child store categories
     *
     */ 
    public function getChildCategories($category)
    {
           if ($this->categoryFlatConfig->isFlatEnabled() && $category->getUseFlatResource()) {
                $subcategories = (array)$category->getChildrenNodes();
            } else {
                $subcategories = $category->getChildren();
            }
            return $subcategories;
    }
}


My Phtml
------------

<?php
$categories = $this->getStoreCategories(true,false,true);

$categoryHelper = $this->getCategoryHelper();
?>
<ul>
<?php
foreach($categories as $category):
    print_r($categoryHelper->getCategoryUrl($category));
     if (!$category->getIsActive()) {
        continue;
     }
?>
<li><a href="<?php echo $categoryHelper->getCategoryUrl($category) ?>"><?php echo $category->getName() ?></a></li>
<?php  
if($childrenCategories = $this->getChildCategories($category)):
?>
<ul>
<?php
foreach($childrenCategories as $childrenCategory):
     if (!$childrenCategory->getIsActive()) {
        continue;
     }
?>
<li><a href="<?php echo $categoryHelper->getCategoryUrl($childrenCategory) ?>"><?php echo $childrenCategory->getName() ?></a></li>
<?php
endforeach;
?>
</ul>
<?php
endif;
endforeach;
?>
</ul>

I want to know that how can i implement this by Knockoutjs.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.