wendydra/app.html

## app.html
<template>
  <div>
      <md-card md-image="http://66.media.tumblr.com/c996589c69acc4edcea56cfbaa804992/tumblr_myy0xwcfJ61sh1wnzo1_500.jpg" md-title="Show.Bind Exploration">
        <div>
        <h4>Observed Issue</h4>

        When using show.bind with a true false to show a HTML element, a click.trigger function will
        cause the show.bind to fail despite properly set true false values.
        </div>
        <h5>isEditing: ${isEditing}</h5>

        <div class="card-action">
            <a class="waves-effect" click.trigger="setTrue()">Set True</a>
            <a class="waves-effect" click.trigger="setFalse()">Set False</a>
        </div>
      </md-card>
      <md-card>
        This card contains a button that will show when isEditing is true.<br>
        <button md-button show.bind="isEditing">Button</button>
      </md-card>
  </div>
</template>

## app.js
export class App {
  isEditing = false;

  setTrue(){
    this.isEditing = true;
  }

  setFalse() {
    this.isEditing = false;
  }
}

## index.html
<!doctype html>
<html>
  <head>
    <title>Aurelia</title>
    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
    <meta name="viewport" content="width=device-width, initial-scale=1">
  </head>
  <body aurelia-app="main">
    <h1>Loading...</h1>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/systemjs/0.19.6/system.js"></script>
    <script src="https://rawgit.com/aurelia-ui-toolkits/aurelia-materialize-bundles/0.1.1/config2.js"></script>
    <script>
      System.import('aurelia-bootstrapper');
    </script>
  </body>
</html>

## main.js
/*******************************************************************************
 * The following two lines enable async/await without using babel's
 * "runtime" transformer. Uncomment the lines if you intend to use async/await.
 *
 * More info here:  https://github.com/jdanyow/aurelia-plunker/issues/2
 */
//import regeneratorRuntime from 'babel-runtime/regenerator';
//window.regeneratorRuntime = regeneratorRuntime;
/******************************************************************************/

export function configure(aurelia) {
  aurelia.use
    .standardConfiguration()
    .developmentLogging()
    .plugin('aurelia-materialize-bridge', bridge => bridge.useAll() );

  aurelia.start().then(a => a.setRoot());
}
	<template>
	<div>
	<md-card md-image="http://66.media.tumblr.com/c996589c69acc4edcea56cfbaa804992/tumblr_myy0xwcfJ61sh1wnzo1_500.jpg" md-title="Show.Bind Exploration">
	<div>
	<h4>Observed Issue</h4>

	When using show.bind with a true false to show a HTML element, a click.trigger function will
	cause the show.bind to fail despite properly set true false values.
	</div>
	<h5>isEditing: ${isEditing}</h5>

	<div class="card-action">
	<a class="waves-effect" click.trigger="setTrue()">Set True</a>
	<a class="waves-effect" click.trigger="setFalse()">Set False</a>
	</div>
	</md-card>
	<md-card>
	This card contains a button that will show when isEditing is true.<br>
	<button md-button show.bind="isEditing">Button</button>
	</md-card>
	</div>
	</template>
	export class App {
	isEditing = false;

	setTrue(){
	this.isEditing = true;
	}

	setFalse() {
	this.isEditing = false;
	}
	}
	<!doctype html>
	<html>
	<head>
	<title>Aurelia</title>
	<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	</head>
	<body aurelia-app="main">
	<h1>Loading...</h1>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/systemjs/0.19.6/system.js"></script>
	<script src="https://rawgit.com/aurelia-ui-toolkits/aurelia-materialize-bundles/0.1.1/config2.js"></script>
	<script>
	System.import('aurelia-bootstrapper');
	</script>
	</body>
	</html>
	/*******************************************************************************
	* The following two lines enable async/await without using babel's
	* "runtime" transformer. Uncomment the lines if you intend to use async/await.
	*
	* More info here: https://github.com/jdanyow/aurelia-plunker/issues/2
	*/
	//import regeneratorRuntime from 'babel-runtime/regenerator';
	//window.regeneratorRuntime = regeneratorRuntime;
	/******************************************************************************/

	export function configure(aurelia) {
	aurelia.use
	.standardConfiguration()
	.developmentLogging()
	.plugin('aurelia-materialize-bridge', bridge => bridge.useAll() );

	aurelia.start().then(a => a.setRoot());
	}