getting specific selected text from md-select when the option has many keys

I have this array of objects:

[
  {name: "Dubai",
  transformed_cost: 50,
  delivery_time: 30
  },
  {name: "Abu Dhabi",
  transformed_cost: 15,
  delivery_time: 7
  },
  {name: "Shariqah",
  transformed_cost: 50,
  delivery_time: 4
  }
]
  

I’m using this array inside md-select as following:

<md-select ng-model='delivery_zone' md-selected-text="getSelectedText()">
  <md-optgroup label="Destinatios">
    <md-option ng-repeat='z in deliveryZones'>
      <div flex layout='row' layout-align="space-between" >
        <span></span>
        <span> AED</span>
        <span style="display: block;">Delivery in: </span>
      </div>
    </md-option>
  </md-optgroup>
</md-select>

the getSelectedText() function I’m using:

$scope.getSelectedText = function() {
    if ($scope.delivery_zone !== undefined) {
        return $scope.delivery_zone;
    }
    else {
        return "Please select a destenation";
    }
};

It returns the whole option as you can see here:

I need to print out inside the options just the name key (Dubai, Abu Dhabi) without transformed_cost and delivery_time.

How can I make it?

Source: AngularJS

from Angular Questions https://angularquestions.com/2017/10/02/getting-specific-selected-text-from-md-select-when-the-option-has-many-keys/
via @lzomedia #developer #freelance #web #lzomedia.com