How to customize displayed text in AngularJS Material Select Option Group?

Question

I have here a snippet

<span class="filter-lbl">Filter&nbsp;by:</span>
<md-input-container>
    <md-select md-container-class="filter-contribution-cont" ng-model="selected" ng-change="selectedChanged(); updateSelectedContribution();" multiple>
        <md-optgroup>
            <md-option ng-value="data.label" ng-click="dropdownClick(data)" ng-selected="data.selected" ng-repeat="data in dataSet | unique: 'label'">{{data.label}}</md-option>
        </md-optgroup>
    </md-select>
</md-input-container>

For example I have a function that I made to construct the text that I want to be displayed named getSelectedContributions(), how do I replace the built-in displayed text made by AngularJS Material?

I'm still very new to AngularJS so if possible I need a simple solution. Thanks!

Answer 1

Found the answer. I just needed to add md-selected-text="getSelectedContributions()" in md-select like this

<span class="filter-lbl">Filter&nbsp;by:</span>
<md-input-container>
    <md-select md-selected-text="getSelectedContributions()" md-container-class="filter-contribution-cont" ng-model="selected" ng-change="selectedChanged(); updateSelectedContribution();" multiple>
        <md-optgroup>
            <md-option ng-value="data.label" ng-click="dropdownClick(data)" ng-selected="data.selected" ng-repeat="data in dataSet | unique: 'label'">{{data.label}}</md-option>
        </md-optgroup>
    </md-select>
</md-input-container>