I wanted to get one result from an array in ng-bind using filter. I want to do as below
<h1 ng-bind="item.Description as item in Items | filter: {id: someID}"></h1>
I want to set h1 to item.Description from Items where someID comes from a drop down. That means, when I select from drop down, h1 is set by filtering Items by SomeID. It's like h1 = Items.FirstOrDefault(x => x.id == someID).Description
The problem here is ng-bind wouldn't recoginize the item in items syntax. But as you mentioned in the title, you can utilize limitTo with ng-repeat to achieve more or less same result. Like this:
<h1 ng-repeat="item in items | filter: {id: someId} | limitTo: 1">
{{item.Description}}
</h1>
working example (used number input for someId for simplicity)
If you have a dropdown then you know what the selection is (via the ng-model). The code you have is using ng-bind but it's the text for ng-repeat. Your best bet is to have a method on the controller:
getItemDescription() {
const selection = this.form.dropdown.selection; // Holds the dropdown 'selection' object (from the ng-model on your select dropdown);
return Items.find((item) => item === selection).description;
}
Then your HTML becomes:
<h1 ng-bind="vm.getItemDescription()"></h1>
