Directive in isolated scope: passing simple value parameter

<!DOCTYPE html>
<html ng-app="myApp">

  <head>
    <link data-require="bootstrap-css@3.3.6" data-semver="3.3.6" rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.css" />
    <script data-require="jquery@*" data-semver="2.2.0" src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
    <script data-require="angular.js@1.5.3" data-semver="1.5.3" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular.min.js"></script>
    <link rel="stylesheet" href="style.css" />
    <script src="script.js"></script>
  </head>

  <body ng-controller="mainCtrl" class="container" style="padding-top:50px;">
    <display-info user="user" infocard="true"></display-info>
    <display-info user="DCUser" infocard="true"></display-info>
  </body>

</html>

angular.module('myApp', []);
angular.module('myApp').controller('mainCtrl', function($scope) {
  $scope.user = {
    name: 'Tony Stark',
    alias: 'Ironman',
    address: {
      street: '10880, Malibu Point',
      city: 'Malibu, Calif',
      country: 'United States',
    },
    teamAffiliation: [
      'Avengers', 'S.H.I.E.L.D', 'Stark Industries', 'Guardians of galaxy'
    ],
    abilities: "Genius-level intellect and highly proficient Scientist, Engineer and business man"
  }
  
  $scope.DCUser = {
    name: 'Bruce Wayne',
    alias: 'Batman',
    address: {
      street: '1007 Mountain Drive',
      city: 'gotham',
      country: 'United States',
    },
    teamAffiliation: [
      'Justice League', 'Batman Family', 'Wayne Enterprise', 'Outsiders'
    ],
    abilities: "Genius-level intellect and highly proficient Scientist, Engineer and business man"
  }
});
angular.module('myApp').directive('displayInfo', function() {
  return {
    templateUrl: "displayInfo.html",
    restrict: "EA",
    scope: {
      user: '=',
      showInfo:'@infocard'
    },
    controller: function($scope) {
      $scope.infocard = ($scope.showInfo === 'true');
      
      $scope.callAvengers = function(user) {
        $scope.infocard=!$scope.infocard;
        user.message = "We will arrive soon buddy!"
      };
    }
  }
});

/* Styles go here */

<div class="panel panel-primary" ng-show="infocard">
  <div class="panel-heading">{{user.alias}}</div>
  <br />
  <div class="panel-body">
    <span style="color:red">Name:{{user.name}}</span>
    <div>
      <h4>Address:</h4> Street: {{user.address.street}}
      <br /> City: {{user.address.city}}
      <br /> Country: {{user.address.country}}
    </div>
    <br /> Team Affiliation:
    <ul>
      <li ng-repeat="team in user.teamAffiliation">
        {{team}}
      </li>
    </ul>
    <div ng-if="user.name==='Tony Stark'">
      <button class="btn btn-danger" ng-click="callAvengers(user)">Call Avengers</button>
    </div>
    <div ng-if="user.name==='Bruce Wayne'">
      <button class="btn btn-danger" ng-click="callAvengers(user)">Call Justice League</button>
    </div>
  </div>
</div>
<div ng-show="!infocard">
  <div ng-show="user.message">{{user.message}}</div>
  <button class="btn btn-success" ng-click="callAvengers(user);">Display Info</button>
</div>