angularjs ng options with condition based on another ng model
<p>I have to filter the ng options with a nested property of the object. here is my code</p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;select ng-model="clas.department" ng-options="department as department.name for department in departments  | filter:{department.course.id : clas.course.id}: true"&gt;
  &lt;option value=""&gt;Select Department&lt;/option&gt;
&lt;/select&gt;</code></pre>
</div>
</div>

where <code>clas.course.id</code> is another ng model.</p>

<p>i am getting this error:</p>

<p><code>angular.js:12477 Error: [$parse:syntax] http://errors.angularjs.org/1.4.7/$parse/syntax?p0=.&amp;p1=is%20unexpected%2C%20expecting%20%5B%3A%5D&amp;p2=34&amp;p3=departments%20%20%7CNaNilter%3A%7Bdepartment.course.id%20%3A%clas.course.id%7D%3A%20true&amp;p4=.course.id%20%3A%clas.course.id%7D%3A%20true
    at Error (native)
    at http://localhost:8000/js/angular.min.js:6:416
    at Object.throwError (http://localhost:8000/js/angular.min.js:209:339)
    at Object.consume (http://localhost:8000/js/angular.min.js:210:9)
    at Object.object (http://localhost:8000/js/angular.min.js:209:171)
    at Object.primary (http://localhost:8000/js/angular.min.js:206:151)
    at Object.unary (http://localhost:8000/js/angular.min.js:205:503)
    at Object.multiplicative (http://localhost:8000/js/angular.min.js:205:249)
    at Object.additive (http://localhost:8000/js/angular.min.js:205:76)
    at Object.relational (http://localhost:8000/js/angular.min.js:204:416)</code></p>