javascript - Angular Material: md-button ~ hoot change the text of the button based on input on NodeRed -

in nodered, use newish ui_dashboard template node, use normal angular material notation buttons etc, have following doing working button:

<md-button ng-style="{background: msg.payload=='0' ?'green':'red'}" ng-click="msg.payload = (msg.payload=='0' ? send({payload: 'event,allsprinkleroff'}) : send({payload: 'event,allsprinkleroff'})) " > button name 

but, want 'button name' change based on incoming msg.payload value. ideas now? googling , searching here did not give me answers? (newbi)

here go - codepen

markup

<div ng-controller="appctrl" ng-cloak="" ng-app="myapp">   <md-button ng-style="{background: msg.payload=='0' ?'green':'red'}" ng-click="msg.payload =(msg.payload=='0' ? send({payload: 'event,allsprinkleroff'}) : send({payload:'event,allsprinkleroff'})) ">payload {{msg.payload}}</md-button>    <br>   <md-button ng-click="togglepayload()">toggle payload</md-button> </div> 

js

angular.module('myapp',['ngmaterial', 'ngmessages'])  .controller('appctrl', function($scope) {   $scope.msg = {     payload: 0   }    $scope.togglepayload = function () {     $scope.msg.payload = ($scope.msg.payload === 0) ? 1 : 0;   } });