将属性添加到Joomla页面的HTML标签的正确方法？

我正在使用AngularJS向一些Joomla文章页面添加一些更高级的功能。在这些页面上，我需要将ng-app属性添加到<HTML>页面上的标记中。目前，我的Joomla（v3.3）页面的常规HTML标签如下所示；

<html prefix="og: http://ogp.me/ns#" xml:lang="en-gb" lang="en-gb">

我需要它看起来像这样；

<html prefix="og: http://ogp.me/ns#" xml:lang="en-gb" lang="en-gb" ng-app="dataManager">

这需要动态一点，因为不同的页面可能需要不同的ng-app指令。在Joomla中有适当的方法吗？

我目前正在使用以下命令导入AngularJS：

<?php 
    $document = JFactory::getDocument();
    $urlAngular = "http://ajax.googleapis.com/ajax/libs/angularjs/1.2.21/angular.min.js";
    $document->addScript($urlAngular); 
?>

感谢您提供的任何帮助。

joomla-api

— 德伯森
source

您目前如何将AngularJS等添加到这些页面？

— David Fritsch 2014年

我使用一个简单的PHP代码块将AngularJS添加到这些页面。这是使用的代码；<pre> {source} <？php $ document = JFactory :: getDocument（）; $ urlAngular =“ ajax.googleapis.com/ajax/libs/angularjs/1.2.21/angular.min.js ”; $ document-> addScript（$ urlAngular）; ？> {/ source} </ pre>

— drobertson 2014年

抱歉，代码混乱。我想不通如何在必须编辑的5分钟内使代码块看起来正确。

— drobertson 2014年

@DougRobertson-您只需更新代码即可更新您的问题；）我已对您的问题进行了相应的编辑

— 2014年

Answers:

您可以这样创建一个system插件：

class plgSystemAddAttr extends JPlugin
{
    public function onAfterRender()
    {
        $document = JFactory::getApplication();
        $htmlString = $document->getBody();

        $dom = new DOMDocument();
        libxml_use_internal_errors(true);
        $dom->loadHTML($htmlString);
        libxml_use_internal_errors(false);
        $htmlTag = $dom->getElementsByTagName('html')->item(0);

        $domAttribute = $dom->createAttribute('ng-app');
        $domAttribute->value = 'dataManager';
        $htmlTag->appendChild($domAttribute);

        $document->setBody($dom->saveHtml());
    }
}

— 法拉曼
source

谢谢，这就是我想要的。我将研究系统插件。在短期内，是否有可能通过嵌入文章本身的PHP来做同样的事情？

— drobertson 2014年

DOMDocument对HTML结构非常敏感。如果无法加载文档，则会导致很大的失败，并且无法恢复较小的HTML错误。我更喜欢直接的preg_replace。

— 阿尼巴尔2014年

@DougRobertson AFAIK，不，这不可能。顺便说一句，我不熟悉AngularJS，但是如果在客户端使用该属性，则也可以在客户端定义它。一个jQuery示例：$('html').attr('ng-app', 'dataManager');

— Farahmand

@Fari我考虑过这样做，但是加载顺序变得棘手。如果我可以控制attr的位置，使其专门在AngularJS初始化之前发生，那么您的想法可能是个不错的主意。到目前为止，我还没到兔子洞那么远。

— drobertson 2014年

您可以使用PHP将动态内容添加到ng-app属性。

在您的\templates\yourtemplate\index.php文件中，更改

<html prefix="og: http://ogp.me/ns#" xml:lang="en-gb" lang="en-gb" ng-app="dataManager">

至

<?php
if ( condition ) {
   $ngapp = "dataManager";
} else {
   $ngapp = "somethingElse";
}
?>
<html prefix="og: http://ogp.me/ns#" xml:lang="en-gb" lang="en-gb" ng-app="<?php echo $ngapp ?>">

— 约翰
source

使用这种方法，我需要为每个要添加的页面修改主模板。可以，但是随着我添加更多页面和ng-app，它变得非常笨拙。我正在寻找一种添加属性的方法，该方法类似于我们向javascript库插入脚本引用的方式。有什么办法吗？

— drobertson 2014年

系统插件可能是最简单的方法。它可以在将呈现的html提供给客户端之前对其进行操作，并使所有会话数据可用以确定适合您的属性。

— Riccardo Zorn 2014年