У меня есть страница с одним контроллером и тремя вкладками, каждая вкладка показывает свою собственную ng-сетку и текстовое поле для фильтрации видимых строк (а не встроенного фильтра).
Я создал эту простую директиву для блока фильтров, которую хочу использовать на каждой вкладке (как и на других страницах).
myDirectives.directive('myGridFilter', function() {
return {
restrict: 'E',
templateUrl: 'filterTemplate.html'
}
});
Это filterTemplate.html:
<label input="filterLabel" for="filterBox">Filter: </label>
<input id="filterBox" type="text" placeholder="type filter here" ng-model="gridOptions.filterOptions.filterText" />
Я создал три ng-сетки ($scope.gridOptions_1
, $scope.gridOptions_2
и $scope.gridOptions_3
), каждая из которых ссылается на соответствующий набор данных для своей вкладки.
Мой вопрос: как я могу изменить директиву, чтобы указать ng-model
как gridOptions_1.filterOptions.filterText
против gridOptions_2.filterOptions.filterText
против gridOptions_3.filterOptions.filterText
против старого доброго gridOption.filterOptions.filterText
?
Вот что я попробовал, но безуспешно ...
- В директиву добавлен
scope: { subgrid: '@subgrid' }
- Изменен файл шаблона, чтобы он имел:
-
ng-model="gridOptions{{subgrid}}.filterOptions.filterText"
-
ng-model="gridOptions[subgrid].filterOptions.filterText"
-
ng-model="gridOptions[scope.subgrid].filterOptions.filterText"
-
- Ссылка на директиву на моей странице изменена на
<myGridFilter subgrid="_1"></myGridFilter>
Я также хотел бы иметь возможность повторно использовать директиву для общего случая gridOptions
на других страницах, поэтому я также попробовал {{subgrid||''}}
в шаблоне, но не пошел дальше, пытаясь приспособить случай по умолчанию '' пока я не выясню, как заставить работать динамический ng-model
...
Спасибо за вашу помощь и предложения!
1 ответ
Я думаю, вы можете просто добавить scope: { subgrid: '=subgrid' }
в директиву и убедиться, что вы вызываете директиву с атрибутом: <my-grid-filter sub-grid="gridOptions_1"></my-grid-filter>
. (Вы пробовали использовать @subgrid
, но @
предназначен для текстовых атрибутов, а =
- для фактической привязки между атрибутами и областью действия директивы).
Похожие вопросы
Новые вопросы
angularjs
Используйте для вопросов об AngularJS (1.x), JavaScript-фреймворке с открытым исходным кодом. НЕ используйте этот тег для Angular 2 или более поздних версий; вместо этого используйте тег [angular].
=
против@
), спасибо; однако мне все еще не удается подключитьsubgrid
к шаблону ...ng-model
просто отображается в источнике как[subgrid]
или{{subgrid}}
(см. мой второй пуля в исходном посте)ng-model="subgrid.filterOptions.filterText"
(я пытался сделать его более сложным, чем нужно). Спасибо еще раз!