2015-02-02 3 views
0

У меня есть небольшая проблема с фильтрацией. Я делаю несколько кнопок:Угловой фильтр содержит

<button ng-click="myFilter = {terms: advertising}">Advertising</button> 
<button ng-click="myFilter = {terms: branding}">Branding</button> 
<button ng-click="myFilter = {terms: packaging}">Packaging</button> 
<button ng-click="myFilter = {terms: print}">Print</button> 

И у меня есть массив, конечно:

$scope.selects = [ 
{terms: 'Advertising | Web',}, 
{terms: 'Branding | Packaging',}, 
{terms: 'Print | Video',}, 
{terms: 'Branding | Print',} 
    ]; 

Итак, как вы можете видеть, у меня есть несколько терминов в одном ключе. Я знаю, что я могу использовать окно поиска для фильтрации, и все будет хорошо. Но я должен использовать кнопки для этого.

Этот метод:

<article class="select_single" dir-paginate="select in selects | itemsPerPage: pageSize | orderBy:sortorder | filter:myFilter" current-page="currentPage"> 

Работает только если я использую ту же строку, как в массиве, но мне нужно фильтровать элементы с подобными им.

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

Остальной код:

<div ng-controller="MyController" class="my-controller"> 


     <div id="loop"> 
      <article class="select_single" dir-paginate="select in selects | itemsPerPage: pageSize | orderBy:sortorder | filter:myFilter" current-page="currentPage"> 
       <img src="{{ select.img }}"> 
       <div class="overlay"> 
        <div class="text"> 
         <h3>{{ select.name }}</h3> 
         <p class="terms">{{ select.terms }} </p> 
         <a href="{{ select.link }}">More Details</a> 
        </div> 
       </div>  
      </article> 
     </div> 

     <div class="sort_handle"> 
      <div ng-controller="OtherController" class="other-controller pull-right"> 
       <div class="text-center"> 
        <dir-pagination-controls boundary-links="true" on-page-change="pageChangeHandler(newPageNumber)" template-url="<?php echo get_template_directory_uri(); ?>/templates/pagination.tpl.html"></dir-pagination-controls> 
       </div> 
      </div> 
     </div> 
    </div> 

Так ..

Мой вопрос заключается в том, чтобы фильтровать эти термины, используя часть массива ключевой строки?

Grettings, W

+0

Это должно быть так же легко, как '». ..избирает фильтр: myFilter "' –

+0

Да, это должно быть :) Но это не так. Я использую:

, но он работает только с полной строкой – Wojtek1150

+0

, что это 'dir-paginate'? –

ответ

2

Это должно быть довольно тривиально, так как ваш фильтр правильно используя правильную структуру, что означало для фильтрации.

Исправлена ​​ошибка в том, что ваш фильтр поиска должен содержать строки для myFilter.terms (обратите внимание на кавычки):

<button ng-click="myFilter = {terms: 'advertising'}">Advertising</button> 
<button ng-click="myFilter = {terms: 'branding'}">Branding</button> 
<button ng-click="myFilter = {terms: 'packaging'}">Packaging</button> 
<button ng-click="myFilter = {terms: 'print'}">Print</button> 

Тогда фильтрация:

<div ng-repeat="select in selects | filter: myFilter"> 
    {{select}} 
</div> 
+0

Это правильный ответ. [Вот рабочий пример] (http://codepen.io/alex-wilmer/pen/JorydP?editors=101) – azium

+0

Да, он отлично работает. Благодаря @New Dev – Wojtek1150