私は AngularJS の初心者で、上司のために非常に基本的な概念実証をまとめています。これはレンタカーのリストで、ビューのメイン領域に結果リストが外部 JSON を介して取り込まれ、その下にフィルター パネルがあります。ここで作成したプランカーを確認できます。
http://plnkr.co/lNJNYagMC2rszbSOF95k
ngRepeat で子オブジェクト/値を正常に参照できました。
<article data-ng-repeat="result in results | filter:search" class="result">
<h3>{{result.carType.name}}, {{result.carDetails.doors}} door, £{{result.price.value}} - {{ result.company.name }}</h3>
<ul class="result-features">
<li>{{result.carDetails.hireDuration}} day hire</li>
<li data-ng-show="result.carDetails.airCon">Air conditioning</li>
<li data-ng-show="result.carDetails.unlimitedMileage">Unlimited Mileage</li>
<li data-ng-show="result.carDetails.theftProtection">Theft Protection</li>
</ul>
</article>
...しかし、これまでのところ、検索フィルターで第 2 レベルの子オブジェクトにアクセスできませんでした。したがって、たとえば、「車の種類」(以下を参照) でフィルタリングしている場合、「search.carType.name」を ngModel としてできるだけ具体的に使用できるようにしたいと考えていますが、これはできません。 「search.carType」を使用するだけで問題なく動作しますが、動作しません。誰かが私が間違っていることについてアドバイスできますか?
<h4>Car type:</h4>
Compact <input type="checkbox" data-ng-model="search.carType" ng-true-value="Compact" ng-false-value="" /><br>
Intermediate <input type="checkbox" data-ng-model="search.carType" ng-true-value="Intermediate" ng-false-value="" /><br>
Premium <input type="checkbox" data-ng-model="search.carType" ng-true-value="Premium" ng-false-value="" /><br>