Несколько ngIncludes с видимыми различными элементами управления

У меня есть фрагмент HTML с собственным контроллером. Я хочу включить этот фрагмент в два разных места.

Если он отображается как дочерний элемент # parent1, я хочу, чтобы некоторые поля были скрыты. Если отображается как часть # parent2, я бы хотел, чтобы другие поля были скрыты.

Я делал это раньше, но не тогда, когда # parent1 и # parent2 могут быть одновременно видимыми.

Ответы

Ответ 1

Вы находитесь в точке, где вам следует, вероятно, прекратить использование ng-include и написать очень простую директиву. Это типичный вариант использования директивы angular с изолированной областью, просто передайте переменную области видимости и используйте ее в своем шаблоне с помощью ngShow ngHide или ngIf:

 .directive('snippy', ['$rootScope',
        function ($rootScope) {
            return {
                restrict: 'E',
                scope: {
                    showit: '='
                },
                templateUrl: 'yoursnippet.html',
                link: function(scope, elem, attrs) {
                   // here goes your controller code
                }
         }

а затем в файле yoursynippet.html:

<div>
   <div ng-show="showit">this is shown/hidden</div>
</div>

а затем в вашем родителе:

<div>
    <snippy showit="anyangularexpression">
    <snippy showit="anyangularexpression2">
</div>