Определения многих угловых директив с петлями

У меня есть куча угловых директив, которые все выглядят одинаково, как (более сложный вариант)Определения многих угловых директив с петлями

app.directive('note', function() { 
    return { 
     restrict: 'E', 
     transclude: true, 
     template: '<div class="' + 'note' + '"></div> 
    } 
});

с note заменен многими другими вещами. Я хочу определить их все в цикле, чтобы оставаться сухим. Я попробовал

var dirs = ['note', 'introduction', 'thing']; 

for (var dir, i = 0; dir = dirs[i]; i++) { 
    app.directive(dir, function() { ... }); 
}

безрезультатно. Есть ли хороший способ сделать это?

источник

2013-07-05 jclancy

Почему странное состояние в цикле? почему бы просто не использовать длину массива, и я, как обычно? Я видел это для нескольких компонентов (используя что-то подобное на самом деле для общих «значков социальных медиа», где он автоматически вытаскивает значок справа и делает ссылку, это не совсем то же самое, поскольку я использую атрибуты но позвольте мне посмотреть, поможет ли это здесь ... Я также видел эту технику для оберток плагина facebook в angularjs. – shaunhusain

@shaunhusain Когда i == dirs.length, dir = undefined, и цикл останавливается. используя угловую форму в любом случае, я предпочитаю угловой.forEach –

@jtseng да, я понимаю, что он все равно будет работать, как правило, видны, когда петли выполняются с таким условием, и кажется излишне запутанным использовать это, когда цикл цикла, проверяющий условие длины, и работает отлично. – shaunhusain

Я не думаю, что вы должны это сделать. Вместо этого вы должны передать значение в директиву. Однако, если вы действительно чувствуете, что вам нужно это сделать, он отлично работает: fiddle.

HTML:

<div ng-app="myApp"> 

     <div ng-controller="MyCtrl"> 
      Hello, {{name}}! 
     </div> 
     <introduction> </introduction> 
     <note></note> 
     <thing></thing> 
     <notAThing></notAThing> 
    </div>

JS:

var myApp = angular.module('myApp',[]); 

    var dirs = ['note', 'introduction', 'thing']; 

    angular.forEach(dirs, function(dir) { 
     myApp.directive(dir, function() { 
      return { 
       restrict: 'E', 
       transclude: true, 
       template: '<div class="' + dir + '">something</div>' 
      } 
     }); 
    });

источник

2013-07-05 23:10:50

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

You should probably read carefully

'. Опять же, я относительно новичок в Angular. Получает ли польза для читаемости перевесить «неестественность» на циклическое создание директивы или нет? – jclancy

@jclancy Ну, создавая новые элементы *, это одна из самых особенных особенностей Angular. Увидев ваш пример, я беру обратно то, что я сказал о передаче ценностей. Думаю, мне нравится, как ты делаешь это лучше. –

Я должен сказать, что это может быть нуб во мне говорить, но я действительно не вижу большую проблему с этим, если вы знаете, что вы '0:

^Это не мой код, а только что-то, что я взял и работал для меня. Как это работает, если у вас есть класс, заданный для любого из значений в массиве, тогда он попытается проанализировать javascript в facebook для узла/элемента.

источник

2013-07-05 23:13:39 shaunhusain

Что такое 'this' в этом случае? 'Window'? – jclancy

Ну, весь этот блок кода находится внутри собственного JS-файла и нигде не обернут его «это относится к глобальному объекту» https: // developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this Да, вы правы – shaunhusain

А, спасибо. Так, действительно, 'window' (или, я думаю, в узле это будет' process'). – jclancy

Определения многих угловых директив с петлями

ответ

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