.html() в моей угловой директиве не работает

Я преобразовываю свой код в угловой, и мне нужна помощь в создании директивы. Я пытаюсь преобразовать следующие.html() в моей угловой директиве не работает

jQuery(document).ready(function ($) { 
"use strict"; 

$('#cool-navigation').append('<ul class="navigation">' + $('.navigation').html() + '</ul>'); 
});

app.directive('coolnavigation', function() { 
    return { template: '<ul class="navigation">' + $('.navigation').html() + '</ul>' }; 
});

Это HTML. Первый взгляд оболочка, а вторая называется topnav

<section data-cc-sizer data-ng-controller="shell as vm"> 

<!-- Sticky Nav --> 
<div data-coolnavigation class="sticky-navigation" id="sticky-navigation"></div> 
<!-- Sticky Nav --> 

<div id="wrapper"> 
    <div class="top_wrapper clearfix"> 
     <header class="top-header shadow"> 
      <div data-ng-include="'/app/layout/topnav.html'"></div> 
     </header> 
    </div> 
</div> 
<section id="content"> 
    <div id="wrapper" data-ng-view></div> 
</section> 
</section> 

<section data-cc-topnav data-ng-controller="topnav as vm"> 

<div class="container"> 
    <div class="row header"> 
     <div class="col-class"> 
      <nav> 
       <ul class="navigation"> 
        <li data-ng-repeat="r in vm.navRoutes"> 
         <a href="#{{r.url}}" class="{{r.className}}" data-ng-bind-html="r.config.settings.content"></a> 
        </li> 
       </ul> 

      </nav> 
     </div> 
    </div> 
</div> 

</section>

Я думаю, что я что-то с .html отсутствует(). Может кто-нибудь помочь мне понять это?

Спасибо!

источник

2014-02-05 MrTouya

'$ ('. Navigation')' ищет элемент в DOM с навигацией классов. Кажется, вы звоните, прежде чем элемент на самом деле там? –

Вы можете быть правы. Я получаю «неопределенный», когда он появляется. Любые предложения по созданию углового эквивалента jquery наверху? – MrTouya

Вы можете показать нам html, который вы пытаетесь преобразовать? – michael

Вы ссылаетесь на $('.navigation') в свой шаблон, который является блоком HTML с некоторым угловым кодом внутри. У вашего шаблона нет гарантии, что Angular предоставил этот бит, поэтому мы используем директивы в первую очередь. Вот почему $ ('. Navigation') пуст. Если вы пытаетесь преобразовать это из jQuery, прекратите использование jQuery.

Директива имеет функцию link, которая происходит после компиляции. Подумайте о функции link, как document.ready в jQuery, но для конкретного элемента или директивы. Конечно, вы пытаетесь обратиться к совершенно другому элементу, чтобы вы не знали, когда это будет сделано. Это указывает на большую проблему ... почему вы пытаетесь скопировать DOM из одной структуры в другую? Просто поместите этот DOM в свой шаблон и назовите его днем.

источник

2014-02-05 21:26:35

Я пробовал это. Это не работает. – MrTouya

app.directive ('coolnavigation', функция() { директивы вара = { ссылка: ссылка, ограничение: 'A' }; обратной директива; функция связи (область применения, элемент, ATTRS) { элемента .append ('

'); } }); – MrTouya

Как я уже сказал, это потому, что вы пытаетесь схватить что-то из другого места в DOM. Ваша директива должна быть у родителя для компиляции garauntee. УДАЛИТЕ jQuery, просто поместите '

' в свой шаблон и назовите его днем. –

.html() в моей угловой директиве не работает

ответ

Смежные вопросы