Странное поведение AngularJS для смарт-таблиц с вложенными объектами и st-search
Я пытаюсь реализовать модуль Smart Table в моем приложении AngularJS. Я предпочел бы это по сравнению с некоторыми другими, главным образом, потому что другие, кажется, требуют много стандартного кода в моем контроллере, и я хотел бы сохранить свои контроллеры как можно более сухими. Но я открыт для других модулей, которые могут выполнить то же самое без шаблонного.
Он отлично работает при работе с массивом объектов с прямым набором, но если некоторые из этих объектов имеют вложенные объекты, фильтрация и сортировка ведут себя странным образом.
Это займет некоторое объяснение, так что терпите меня.
Прежде всего, вот мой массив вложенных объектов (сокращенно для удобства чтения здесь):
$scope.products = [
{
'display': 'Live',
'name': 'LC1D09',
'category': 'Motor Control',
'subcategory': 'Contactor',
'manufacturer': 'Telemecanique',
'specs': {
'phase': 3,
'poles': 3
},
'new': {
'price': 158.95
},
'refurbished': {
'price': 145
},
'onlineStores': {
'amazon': true,
'ebay': false
},
'isCool': true
},
{
'display': 'Pending',
'name': 'FA32020',
'category': 'Circuit Breaker',
'subcategory': 'Molded Case',
'manufacturer': 'Square D',
'specs': {
'phase': 1,
'poles': 2
},
'new': {
'price': 217.79
},
'refurbished': {
'price': 192.82
},
'onlineStores': {
'amazon': true,
'ebay': true
},
'isCool': false
}
];
$scope.displayedProducts = $scope.products;
Вот мой HTML:
<table st-table="displayedProducts" st-safe-src="products" class="table table-striped table-bordered table-hover">
<thead>
<tr>
<th st-sort="name">Name</th>
<th st-sort="category">Category</th>
<th>Subcategory</th>
<th>Manufacturer</th>
<th>New Price</th>
<th>Refurb. Price</th>
<th>Display</th>
<th>Specs</th>
<th>Cool</th>
</tr>
<tr>
<th><input st-search="'name'" placeholder="" class="input-sm form-control" type="search"/></th>
<th><input st-search="'category'" placeholder="" class="input-sm form-control" type="search"/></th>
<th><input st-search="'subcategory'" placeholder="" class="input-sm form-control" type="search"/></th>
<th><input st-search="'manufacturer'" placeholder="" class="input-sm form-control" type="search"/></th>
<th><input st-search="new.price" placeholder="" class="input-sm form-control" type="search"/></th>
<th><input st-search="refurbished.price" placeholder="" class="input-sm form-control" type="search"/></th>
<th><input st-search="'display'" placeholder="" class="input-sm form-control" type="search"/></th>
<th><input st-search="'specs'" placeholder="" class="input-sm form-control" type="search"/></th>
<th>
<select st-search="onlineStores.ebay" class="form-control">
<option value=""></option>
<option value="true">Yes</option>
<option value="false">No</option>
</select>
</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="product in displayedProducts">
<td>{{product.name}}</td>
<td>{{product.category}}</td>
<td>{{product.subcategory}}</td>
<td>{{product.manufacturer}}</td>
<td>${{product.new.price | number : 0}}</td>
<td>${{product.refurbished.price | number : 0}}</td>
<td>{{product.display}}</td>
<td>{{product.specs}}</td>
<td>{{product.onlineStores.ebay}}</td>
</tr>
</tbody>
</table>
Таквсе это работает нормально, если в моем массиве нет вложенных объектов. Но с вложенными объектами (например,st-search="new.price"
Я получаю следующие проблемы (см. Скриншот):
True
покажет все записи, ноFalse
покажет только запись, значение которойFalse
.Кто-нибудь еще разобрался, как обращаться с вложенными объектами и модулем смарт-таблицы?