angularjs - Angular-material md-select with images or svg -


i using angular material, want use md-select images/svg; using md-option ng-repeat , list of options works, when select see text.

is feasible?

thanks

<md-select ng-model="mkt.bookmaker" placeholder="select bookmaker">    <md-option ng-value="opt" ng-repeat="opt in mkt.selected.matchinfo.bookmakers">      <md-icon md-svg-src="{{ opt.logo }}"></md-icon>{{ opt.name }}    </md-option>  </md-select>

here screenshots: enter image description here enter image description here

i found nice way use md-select in angular material github

here plunker solution, , below preview.

controller:

var app = angular.module('demoapp', ['ngmaterial']);  app.controller('mainctrl', function($scope) {      $scope.options = [       {         name: 'rome',         size: '200€',         image: 'http://lorempixel.com/120/60/cats/'       },       {         name: 'naples',         size: '230€',         image: 'http://lorempixel.com/120/60/food/'       }       ];        $scope.curroption =   $scope.options[1];        $scope.updatedata = function(){         $scope.options = [           {             name: 'london',             size: '400€',             image: 'http://lorempixel.com/60/60/abstract/'           },           {             name: 'paris',             size: '900€',             image: 'http://lorempixel.com/60/60/nature/'           },           {             name: 'rome',             size: '200€',             image: 'http://lorempixel.com/60/60/sport/'           },           {             name: 'naples',             size: '230€',             image: 'http://lorempixel.com/60/60'           }           ];            $scope.curroption =   $scope.options[1];       }  }); 

my html:

    <md-select data-ng-model="curroption">       <md-select-label><img src="{{ curroption.image }}" /></md-select-label>         <md-option data-ng-value="opt" data-ng-repeat="opt in options"><img src="{{ opt.image }}" /></md-option>     </md-select> 

Comments

Popular posts from this blog

asp.net mvc - SSO between MVCForum and Umbraco7 -

Python Tkinter keyboard using bind -

ubuntu - Selenium Node Not Connecting to Hub, Not Opening Port -