Skip to content

Instantly share code, notes, and snippets.

@stakx

stakx/index.html

Created February 14, 2017 11:03
Show Gist options
  • Save stakx/2a08e8fade956c718c5345bf83b5e3dd to your computer and use it in GitHub Desktop.
Save stakx/2a08e8fade956c718c5345bf83b5e3dd to your computer and use it in GitHub Desktop.
Download ZIP
Demonstrates a bug with `md-truncate` in `angular-material` versions 1.1.2 and 1.1.3
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<script src="node_modules/angular/angular.min.js"></script>
<script src="node_modules/angular-animate/angular-animate.min.js"></script>
<script src="node_modules/angular-aria/angular-aria.min.js"></script>
<script src="node_modules/angular-material/angular-material.min.js"></script>
<link rel="stylesheet" href="node_modules/angular-material/angular-material.min.css">
</head>
<body ng-app="app">
<some-component></some-component>
<script>
var module = angular.module("app", ["ngMaterial"]);
module.component("someComponent", {
controller: function() {
var $ctrl = this;
$ctrl.logMessage = function() {
console.log("This message will not be logged because `md-truncate` is present in template.");
};
},
template: `
<md-toolbar>
<div class='md-toolbar-tools'>
<span flex md-truncate>Some text</span>
<md-button class="md-icon-button" aria-label='Account' ng-click='$ctrl.logMessage()'>
<md-icon md-svg-icon="ic_account_box_white_36px.svg"></md-icon>
</md-button>
</div>
</md-toolbar>`
});
</script>
</body>
</html>
Raw
package.json
{
"name": "md-truncate-bug-demo",
"version": "1.0.0",
"description": "Demonstrates a bug introduced in angular-material@1.1.2",
"scripts": {
"start": "serve"
},
"author": "stakx",
"dependencies": {
"angular": "1.5.11",
"angular-animate": "1.5.11",
"angular-aria": "1.5.11",
"angular-material": "1.1.2"
},
"devDependencies": {
"serve": "^3.3.0"
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment