вызывающие директивы по Logic on angularjs

Question

У меня есть сообщение с сообщением, которое будет отображаться с использованием шаблона различий по типу уведомления о различиях.

Теперь я сделать шаблон в директивах, я показываю правую директиву с помощью нг-переключателя, например:

<ul> 
<li ng-repeat="notify in notifies | orderBy: 'id'" > 
    <div ng-switch on="notify.type"> 
     <div ng-switch-when="1"> 
      <span ng-notify-A ng-notify="notify"></span> 
     </div> 
     <div ng-switch-when="2"> 
      <span ng-notify-B ng-notify="notify"></span> 
     </div> 
     <div ng-switch-when="3"> 
      <span ng-notify-C ng-notify="notify"></span> 
     </div> 
    </div> 
</li> 
</ul> 

Но я действительно думаю, что это может быть лучше, с установкой логики сценария Java, то выход , вместо ng-переключателя. Она должна быть работа с некоторым массивом для хранения [тип => директива Name], как это:

array[1]="ng-notify-A"; 
array[2]="ng-notify-B"; 
array[3]="ng-notify-C"; 

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

Answer 1

Вы можете сделать это с помощью ngInclude так:

.constant('tpl_array', { 
    '1': 'notify1.tpl.html', 
    '2': 'notify2.tpl.html', 
    '3': 'notify3.tpl.html' 
}); 

.directive("myNotification", function(tpl_array) { 
    return { 
    template: '<ng-include src="getTemplateUrl()" />', 
    scope: { 
     notify: '=' 
    }, 
    restrict: 'E', 
    controller: function(scope) { 
     scope.getTemplateUrl = function() { 
     return tpl_array[scope.notify.type]; 
     }; 
    } 
    }; 
}); 

# some.tpl.html 
<ul> 
    <my-notification ng-repeat="notify in notifies | orderBy: 'id'" notify="notify"> 
</ul> 

# notify1.tpl.html 
<li><span ng-notify-A ng-notify="notify"></span></li> 

# notify2.tpl.html 
<li><span ng-notify-B ng-notify="notify"></span></li> 

# notify3.tpl.html 
<li><span ng-notify-C ng-notify="notify"></span></li> 

Answer 2

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

Создайте три шаблона под названием ng-notify-A.html, ng-notify-B.html и т. Д. Затем выполните <ng-include src="notify.type + '.html'">.