Joomla 페이지의 HTML 태그에 속성을 추가하는 올바른 방법은 무엇입니까?


11

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); 
?>

도움을 주셔서 감사합니다.


현재 AngularJS 등을 어떻게 해당 페이지에만 추가합니까?
David Fritsch 2

간단한 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

엉망인 코드가 유감입니다. 코드 블록을 편집 해야하는 5 분 안에 올바르게 표시하는 방법을 알 수 없었습니다.
drobertson

@DougRobertson-코드 업데이트를 위해 질문을 간단하게 업데이트 할 수 있습니다.;) 질문을 적절히 편집했습니다.
Lodder

답변:


5

다음 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());
    }
}

고마워, 이것이 내가 찾던 것입니다. 시스템 플러그인에서 작업하겠습니다. 단기적으로 기사 자체에 포함 된 PHP에서 이와 동일한 작업을 수행 할 수 있습니까?
drobertson

DOMDocument는 HTML 구조에 매우 민감합니다. 문서를로드하지 못하면 크게 실패하고 사소한 Html 오류를 복구 할 방법이 없습니다. 나는 preg_replace를 선호한다 .
Anibal

@ DougRobertson AFAIK는 불가능합니다. BTW AngularJS에 익숙하지 않지만 클라이언트 측에서 속성을 사용하는 경우 클라이언트 측에서도 속성을 정의 할 수 있습니다. jQuery 예제 :$('html').attr('ng-app', 'dataManager');
Farahmand

@Fari 나는 그것을 고려했지만 부하 순서는 까다로웠다. AngularJS가 초기화되기 전에 attr의 배치를 제어 할 수 있다면 아이디어가 큰 것일 수 있습니다. 지금까지 나는 토끼 구멍 아래로 그것을 얻지 못했습니다.
drobertson

1

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 ?>">

이 방법을 사용하면 추가하려는 모든 페이지에 대한 마스터 템플릿을 수정해야합니다. 작동하지만 페이지와 ng-app를 더 추가하면 다루기가 어렵습니다. 자바 스크립트 라이브러리에 스크립트 참조를 삽입하는 방법과 유사한 속성을 추가하는 방법을 찾고 있습니다. 이것을 할 수있는 방법이 있습니까?
drobertson

1
아마도 시스템 플러그인이 가장 쉬운 방법 일 것입니다. 클라이언트에게 제공하기 직전에 렌더링 된 HTML을 조작 할 수 있으며 모든 세션 데이터를 사용하여 적합한 속성을 결정할 수 있습니다.
Riccardo Zorn
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.