Как корневой элемент вложенного дочернего элемента работает на одном уровне корневого элемента директивы родителя?

Question

Здравствуйте, я сейчас в ситуации, которую не могу найти нигде,

Я хотел бы знать, как и если можно заменить содержимое корневого элемента директивы одним объявленным из вложенного (дочернего) директивы.

<div id=”main”> 
    <nav> 
    <main-directive></main-directive> 
    </nav> 
</div> 

//mainDirective’s template 
<div id=”mainDir> 
    <p>Hello World </p> 
    <child-directive></child-Directive> 
</div> 

//childDirective’s template 
<div id=”childDir”> 
    <p>I conquered the world</p> 
</div> 

То, что я на самом деле пытается сделать это, когда я применить нг щелчок от mainDirective то childDirective появляется над mainDirective заменой положение DIV, где он расположен так, в этом случае будет заменен корневым элементом childDirective На боковой ноте, когда я нажимаю кнопку «Назад», скрывается дочерняя директория, а корневой элемент родителя снова отображается.

-> mainDirective-> OnClick() -> childDirective -> OnBackClick() -> mainDirective

пример, где это происходит здесь и я реализую нечто подобное, но я не получаю те же результаты, в этом исходном коде и после его полного разрушения я не вижу, что у меня неправильно.

https://github.com/wuxiaoying/angular-multilevelpushmenu
Я стараюсь на гораздо более простом уровне
plunker

Answer 1

Таким образом, вы можете использовать простую команду JavaScript:

//mainDirective’s template 
<div id=”mainDir> 
    <p>Hello World </p> 
    <div id="childcontent"></div> 
// This is the new DIV where the Content of the childDir div will be after clicking the button. 
</div> 

//childDirective’s template 
<div id=”childDir”> 
    <p>I conquered the world</p> 
</div> 

Так сделать функцию, которая заменяет содержимое из ДИВ childcontent который содержание ребенкаДир

function replacecontent() 
{ 
    document.getElementById('childcontent').innerHTML = document.getElementById('childDir').innerHTML; 
} 

Приветствия