1

我想这个问题可能与如何在多模块 Phalcon 应用程序中使用“主布局”视图具有相同的结果？

我的主布局视图具有整个应用程序的基本 html 结构，并且我正在使用控制器布局视图来呈现该控制器的内容。我相信到目前为止我做得对吗？

但是现在我需要在我的主布局视图中加载与该模块控制器相关的特定 JS 和 CSS 文件。

目前我正在我的主布局文件中加载所有 CSS 和 JS，但这完全违背了多模块方法。每个模块都应该能够加载 css/js 文件，而无需修改核心布局文件。

理想情况下，我希望采用与设置页面标题相同的方法

控制器： Phalcon\Tag::setStylesheetLink(" http://fonts.googleapis.com/css?family=Rosario ", false);

视图：回声 Phalcon\Tag::getStylesheetLink();

有没有其他方法可以实现我可能会错过的这一点？

4

2 回答 2

4

目前没有办法创建某种排序功能（样式表按照您设置的顺序打印出来）或一个收集工具，您只需将样式表添加到其中\Phalcon\Tag::stylesheetLink()就可以打印出来。

但是，您可以使用自定义类实现所需的功能，如下所示：

在您的 config.ini 中，您有此部分

[resource]
css.bootstrap = "/public/css/bootstrap.css"
css.index     = "/public/css/index.css"
css.about     = "/public/css/about.css"
css.contact   = "/public/css/contact.css"

创建一个类\MyApp\Tag

namespace MyApp;

class Tag
{
    private $_css = array();

    public function add($css)
    {
        $this->_css[$css] = true;
    }

    public function remove($css)
    {
        $this->_css[$css] = false;
    }

    public function clear()
    {
        $this->_css = array();
    }

    public function generate()
    {
        $config = \Phalcon\DI::getDefault()->get('config');
        $output = '';

        foreach ($this->_css as $css => $active)
        {
            if ($active)
            {
                if (isset($config->resource->css->$css))
                {
                    $output .= \Phalcon\Tag::stylesheetLink($config->resource->css->$css);
            }
        }

        return $output;
    }
}

然后在您的控制器中，您可以执行以下操作：

$style = new \MyApp\Tag();
$style->add('bootstrap');
$style->add('about');

$this->view->setVar('stylesheets', $style->generate();

在您看来：

<?php echo $stylesheets; ?>
于 2012-11-07T05:33:40.843 回答
0

这是一种手动操作 js 和 css 文件资产顺序的方法。

首先，在控制器中添加 css 和 js 路径时，使用自动 Phalcon\Assets\Collection 容器来存储您的临时资产：

$this->assets->addJs('js/bootstrap-multiselect.js');
$this->assets->addCss('css/bootstrap-multiselect.css');

在所有控制器扩展的自定义 BaseController 中，添加一个 afterExecuteRoute() 公共方法：

/**
 * stuff to do after a route has been executed
 * this is where we attach standard js and css assets
 * */
public function afterExecuteRoute(){
    // wait to rebuild assets until after the dispatcher is finished
    if( ! $this->dispatcher->isFinished() ){
        return;
    }
    ...
}

一旦我们确定当前路由已完成执行，我们可以从 Phalcon\Assets\Manager 中的自动 js 和 css 集合中提取临时资产，将它们附加到我们的常见资产文件列表中，对它们进行排序和去重，然后将它们放入新的自定义集合中：

// get list of js files added to the standard js collection
$append_js = array();
forEach( $this->assets->getJs() as $js){
    $append_js[] = $js->getPath();
}
// declare paths to common js assets
$js_assets = array(
    'js/jquery-2.1.1.min.js',
    'js/jquery-ui.min.js',
    'js/bootstrap.min.js',
);
// merge common paths with ad-hoc paths
$js_assets = array_merge( $js_assets, $append_js );
$js_assets = array_unique( $js_assets ); // dedup
// add js assets to a new collection
$js_collection = $this->assets->collection('header_js');
forEach( $js_assets as $js_path ){
    $js_collection->addJs( $js_path );
}

将 css 资源重新构建到新集合中的工作方式相同：

// get list of css files added to the standard css collection
$append_css = array();
forEach( $this->assets->getCss() as $css ){
    $append_css[] = $css->getPath();
}
// declare paths to common css assets
$css_assets = array(
    'css/jquery-ui.min.css',
    'css/jquery-ui.theme.min.css',
    'css/jquery-ui.structure.min.css',
    'css/bootstrap.min.css',
    'css/bootstrap-theme.min.css',
    'css/main.css',
);
// merge common paths with ad-hoc paths
$css_assets = array_merge( $css_assets, $append_css );
$css_assets = array_unique( $css_assets ); // dedup
// add css assets to a new collection
$css_collection = $this->assets->collection('header_css');
forEach( $css_assets as $css_path ){
    $css_collection->addCss( $css_path );
}

最后，当您在模板中输出 js 和 css 资产时，输出新的自定义集合，而不是 Phalcon\Assets\Manager 自动创建的默认集合：

{{ getDoctype() }}
<html>
    <head>
        {{ tag.getTitle() }}
        {{ assets.outputCss( 'header_css' ) }}
        {{ assets.outputJs( 'header_js' ) }}
    </head>
于 2014-10-16T00:05:54.197 回答