AngularJS - Filter nested object in Javascript
<p>I've a nested object as following:</p>

<pre><code>[
  {
    "$id": "25",
    "Field": {
      "$id": "26",
      "Key": "bb3927b1-fcbb-4fc4-8eff-24b7a20fad7b",
      "EntityKey": "e904000c-b0b8-49ca-8a49-42a2e5b5d295",
      "PostalCode": "12345",
      "City": "My city1"
    },
    "EntityId": "MyEntity"
  },
  {
    "$id": "27",
    "Field": {
      "$id": "28",
      "Key": "ad4f2cb5-7397-474d-aed7-ff4bcc14d292",
      "EntityKey": "e904000c-b0b8-49ca-8a49-42a2e5b5d295",
      "PostalCode": "67890",
      "City": "My city2"
    },
    "EntityId": "MyEntity"
  }
]
</code></pre>

<p>In my HTML page, I'd like to filter by PostalCode or City:</p>

<pre><code>&lt;select ng-model="filterBy" ng-init="filterBy='EntityId'"&gt;
  &lt;option value="EntityId"&gt;Entity&lt;/option&gt;
  &lt;option value="Field.PostalCode"&gt;PostalCode&lt;/option&gt;
  &lt;option value="Field.City"&gt;City&lt;/option&gt;
&lt;/select&gt;
&lt;input type="text" ng-model="query[filterBy]" autofocus /&gt;
</code></pre>

<p>Using the function in JavaScript:</p>

<pre><code>$filter('filter')(array, expression, comparator)
</code></pre>

<p>I can see only EntityId which is working, but not the others fields.</p>

<p>P.S: I know how to use it in HTML binding:</p>

<pre><code>    | filter: {Field: {City: 'my-value'}} 
</code></pre>

<p>My intention is to do the same using the filter in JavaScript.</p>

<p>Thanks for your help.</p>

<p>Omar</p>