Skip to content
This repository was archived by the owner on Sep 5, 2024. It is now read-only.

Commit 86d32e4

Browse files
committed
docs(changelog): add breaking change to md-selected-text for 1.1.2
Fixes #10912.
1 parent 5aef450 commit 86d32e4

File tree

1 file changed

+47
-1
lines changed

1 file changed

+47
-1
lines changed

CHANGELOG.md

Lines changed: 47 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -442,8 +442,54 @@ MyController.prototype.$onInit = function() {
442442

443443
### BREAKING CHANGES
444444

445-
* autocomplete: The autocomplete validator `md-require-match` no longer matches if the search text is empty
445+
* **autocomplete:** The autocomplete validator `md-require-match` no longer matches if the search text is empty.
446+
* **select:** `md-selected-text` now only accepts text. It used to accept and render html but this was an XSS vulnerability.
447+
It was fixed in: block xss on md-select-label ([#10023](https://github.com/angular/material/issues/10023)) ([f7ecb4f](https://github.com/angular/material/commit/f7ecb4f)).
446448

449+
We have added a new `md-selected-html` API for `md-select`. It accepts an expression to be evaluated
450+
that will return a string to be displayed as a placeholder in the select input box when it is
451+
closed. The value will be treated as html. The value **must** either be explicitly marked as
452+
**trustedHtml** or the **ngSanitize** module must be loaded.
453+
454+
Given the following code:
455+
```html
456+
<md-select ng-model="selectedItem" md-selected-text="getSelectedText()">
457+
```
458+
```js
459+
angular
460+
.module('selectDemoSelectedText', ['ngMaterial'])
461+
.controller('SelectedTextController', function($scope) {
462+
$scope.items = [1, 2, 3, 4, 5, 6, 7];
463+
$scope.selectedItem = undefined;
464+
$scope.getSelectedText = function() {
465+
if ($scope.selectedItem !== undefined) {
466+
return "You have selected: Item <strong>" + $scope.selectedItem + "</strong>";
467+
} else {
468+
return "Please select an item";
469+
}
470+
};
471+
});
472+
```
473+
474+
Change it to this:
475+
```html
476+
<md-select ng-model="selectedItem" md-selected-html="getSelectedText()">
477+
```
478+
```js
479+
angular
480+
.module('selectDemoSelectedText', ['ngMaterial', 'ngSanitize'])
481+
.controller('SelectedTextController', function($scope) {
482+
$scope.items = [1, 2, 3, 4, 5, 6, 7];
483+
$scope.selectedItem = undefined;
484+
$scope.getSelectedText = function() {
485+
if ($scope.selectedItem !== undefined) {
486+
return "You have selected: Item <strong>" + $scope.selectedItem + "</strong>";
487+
} else {
488+
return "Please select an item";
489+
}
490+
};
491+
});
492+
```
447493

448494
<a name="1.1.1"></a>
449495
## [Angular Material 1.1.1](https://github.com/angular/material/compare/v1.1.0...v1.1.1) (2016-09-01)

0 commit comments

Comments
 (0)