2014-12-16 5 views
-1

Я новый с угловым, и у меня проблема с фильтром. У меня есть два разных файла JSON как это:Создайте фильтр Angularjs с двумя файлами json

[ 
     { 
      "IdPers": "1067", 
      "CognNome": "JANE SMITH", 
      "Sex": "F" 

     }, 
     { 
      "IdPers": "1093", 
      "CognNome": "JOHN SMITH", 
      "Sex": "M" 

     } 

     ] 

и: [

 { 
      "IdPers": "1067", 
      "DescRuol": "Membro" 
     }, 
     { 
      "IdPers": "163", 
      "DescRuol": "Membro" 
     } 
     ] 

Ставлю рабочую Plunker: http://plnkr.co/edit/1xkyxRallRGtj83fSteg?p=preview

Я должен создать фильтр с полем «DescRuol », который находится в файле« OutCommissioni.json », два файла имеют одинаковое поле« id ». Я думал, что могу сделать, как присоединиться, но я не могу сделать что-то, что работает! Спасибо за любую помощь

+0

ли это возможная альтернатива? Не могли бы вы переписать оба файла в один? – inoabrian

ответ

0

Редактировать: игнорировать этот ответ - я неправильно понял вопрос. Новый ответ был представлен с окончательной информацией после того, как я разработал то, что действительно хотел в комментариях к этому ответу.

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

var App = angular.module('App', []); 
App.controller("OutAnCtrl", function ($http, $scope) { 

    $scope.data = []; 

    $http.get('OutAnagrafica.json') 
     .success(function (data) { 
      data.forEach(function(item) { 
       item.name = item.CognNome; 
      }); 
      $scope.data.push.apply($scope.data, data); 
     }); 

    $http.get('OutCommissioni.json') 
     .success(function (data) { 
      data.forEach(function(item) { 
      item.name = item.DescRuol; 
      }); 
      $scope.data.push.apply($scope.data, data); 
     }); 

    $scope.clearBox = function() { 
     $scope.filter = ""; 
    }; 

}); 

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

<tr data-ng-repeat="Person in data|filter:filter"> 
    <td>{{Person.IdPers}}</td> 
    <td>{{Person.name}}</td> 
    <td>{{Person.Sex}}</td> 
</tr> 

обновленный пример: http://plnkr.co/edit/03rwNY7eLX9i9VCTHz7Z?p=preview

Edit: я, наверное, неправильно понял, и вы, вероятно, не нужны эти свойства объединены. Ключевая часть только для добавления обоих массивов в один массив с помощью Array.push.apply

// Create initial array 
$scope.data = []; 

// Append some arrays 
$scope.data.push.apply($scope.data, [1,2,3]); 
$scope.data.push.apply($scope.data, [4,5,6]); 

// $scope.data will now contain [1,2,3,4,5,6] 

Edit: Я думаю, что это то, что вы ищете? http://plnkr.co/edit/jvyXlpv2iBh2n4pZ1miv?p=preview

<label for="DescRuol">DescRuol:</label> 
<select data-ng-options="item.IdPers as item.DescRuol for item in OutCommissioni" id="DescRuol" data-ng-model="filter.IdPers" class="form-control input-sm"></select> 
+0

Спасибо за ваш ответ, вы здорово! Может быть, я не могу объяснить очень хорошо, но то, что я хочу, это фильтр с полем «DescRuol», и если я выберу «membro», фильтр приведет к Джейн Смит, потому что у них одинаковый идентификатор. Я не знаю. Если вы понимаете, извините за мой английский! – sidos

+0

EDIT: я использую "уникальный" фильтр из UI-Utils для удаления дубликатов в вариантах, но когда у меня есть [ { "IdPers": "163", "DescRuol": "Presidente" }, { "IdPers": "163", "DescRuol": "Membro" } ] фильтр не работает хорошо, потому что будет фильтровать только один DescRuol. Уникальная проблема? есть способ заставить фильтр работать хорошо? – sidos

+0

А, ок. Думаю, теперь я понимаю вашу проблему. Похоже, вы пытаетесь укупоривать окно выбора выпадающего списка с неповторимыми значениями? Если это так, просто не имеет смысла это делать. –

0

Для будущих читателей, пожалуйста, игнорировать мой другой ответ - я неправильно понял вопрос и проработаны детали с ОП в комментариях нет.

Чтобы иметь поле выбора с несколькими вариантами, используя то же самое значение, первая вещь, чтобы не использовать идентификатор в качестве прямого значения, что выбрать окно будет использовать - вместо того, чтобы ссылаться на объект непосредственно:

<select data-ng-options="item as item.DescRuol for item in OutCommissioni" id="DescRuol" data-ng-model="filter.IdPers" class="form-control input-sm"></select> 

" item as item.DescRuol "будет использовать сам объект как значение модели, а не только значение id.

Далее, вместо того, чтобы использовать «filter» объект непосредственно в фильтре, обеспечивают новый объект, который содержит значения, которые нужно от вашего объекта фильтра:

<tr data-ng-repeat="Person in OutAnagrafica|filter:{Sex:filter.Sex,IdPers:filter.IdPers.IdPers}"> 

Рабочий пример здесь: http://plnkr.co/edit/gMvuNny99b8aV66C8GAw?p=preview

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