2

Attempting to use the md-selected-html expression that can be seen on this page. :

https://material.angularjs.org/latest/api/directive/mdSelect

There are no examples of this usage on the interwebs that I have been able to find. I have been able to find examples of the md-selected-text expression on the web working without issue. The first codepen below is an example of this working and the javascript function firing.

https://codepen.io/anon/pen/ONEQmE?editors=1010

<md-select ng-model="selectedItem" md-selected-text="getSelectedText()">
          <md-optgroup label="items">
            <md-option ng-value="item" ng-repeat="item in items">Item {{item}}</md-option>
          </md-optgroup>
</md-select>

The below is my version with the md-selected-html expression present and not firing a javascript function. Any ideas on why this is not working?

https://codepen.io/billBlankenship/pen/bWJvvo?editors=1010

<md-select ng-model="selectedItem" md-selected-html="getSelectedText()">
          <md-optgroup label="items">
            <md-option ng-value="item" ng-repeat="item in items">Item {{item}}</md-option>
          </md-optgroup>
</md-select>
Bill Blankenship
  • 3,316
  • 6
  • 43
  • 73

1 Answers1

0

md-selected-html expression "Expression to be evaluated that will return a string to be displayed as a placeholder in the select input box when it is closed. The value will be treated as html. The value must either be explicitly marked as trustedHtml or the ngSanitize module must be loaded."

You need to pass an expression that will return a string. Mind the last sentence, that the string (treated as html) should be trustedAsHtml or ngSanitize module must be loaded.

my working example:

<md-select md-selected-html="getSelectedHtml()" ...>

angular.module("myApp", ['ngSanitize']).controller('myController', function($scope){
   $scope.getSelectedHtml = function(){
      return "<span>Your custom html here</span>";
   }
});
Iulian Serbanoiu
  • 1