md-select mit mehrfachen - Grenzwert der ausgewählten Menge

Question

Bei Verwendung des eckigen Materials md-select mit multiple wird jedes ausgewählte Element angezeigt. Ich habe einen Multiple Selector, der Counties anzeigt, und alle sollen vorausgewählt sein. Dies führt zu einer Liste mit mehr als 30 Elementen, die für die Seiteneinrichtung nicht besonders gut aussehen.

Alle Optionen, die die Auswahl einschränken können, nachdem sie ausgewählt wurden?

Ist es irgendwie möglich, den md-select-text anzuzeigen, wenn Sie ein Limit überschreiten, in meinem Fall 3 oder mehr?

Irgendwelche anderen Lösungen?

Link auf mehrere codepen Beispiele

Answer 1

Es gibt keinen direkten Weg, dies zu erreichen, ist aber Sie wollen einfach nur eine begrenzte Textpost Auswahl anzuzeigen, können Sie die folgenden using md-selected-text versuchen.

<md-select ng-model="selected" placeholder="Pick" ng-change="onChange()" md-on-open="onOpen()" multiple md-selected-text="getSelectedText()"> 
<!-- OPTIONS --> 
</md-select> 

Und in JS:

$scope.getSelectedText = function() { 
    console.log($scope.selected); 
    if ($scope.selected !== undefined) { 
     var filtered=filterSelectedItems($scope.selected); //Filter the display string over here 
     return filtered 
} else { 
    return "Please select an item"; 
} 
} 

Das ng-Modell selected bei multiple-Modus ist ein array.Iterate über sie und eine komprimierte Zeichenfolge anzuzeigen. Außerdem können Sie einen Tooltip darüber setzen, um die vollständigen ausgewählten Elemente anzuzeigen.