AngularJS - jquery Select2

<!DOCTYPE html>
<html>

<head>
  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/css/select2.min.css" />
  <script src="http://code.jquery.com/jquery-2.0.3.min.js" data-semver="2.0.3" data-require="jquery@2.0.3"></script>
  <script src="//cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/js/select2.min.js"></script>
  <script data-require="angular.js@1.4.0-rc.1" data-semver="1.3.15" src="https://code.angularjs.org/1.3.15/angular.js"></script>
  <link href="style.css" rel="stylesheet" />
  <script src="script.js"></script>
</head>

<body ng-controller="MainCtrl" ng-app="app">
  <h1>Hello Plunker!</h1>
  <select style="width: 100%;" class="form-control" select2="" multiple ng-model="client.countries">
    <option>op1</option>
    <option>op3</option>
  </select>

  <br>
  <br>
  <br>selected: {{client.countries}}
  <br>
  <br>
  <button ng-click="client.primary_address.country = 'Australia'">Select Straya!</button>
  <br>
  <button ng-click="disabled = !disabled">Toggle disabled</button>
  <br>
  <button ng-click="client.primary_address.country = null; client.countries = newCountryList">Switch to a new country list</button>
</body>

</html>

// Code goes here
var app = angular.module('app', []);

app.directive("select2", function($timeout, $parse) {
  return {
    restrict: 'AC',
    require: 'ngModel',
    link: function(scope, element, attrs, ctrl) {
      console.log(attrs);
      $timeout(function() {
        element.select2({tags: true});
      });

      var refreshSelect = function() {
        // if (!element.select2Initialized) return;
        $timeout(function() {
          element.trigger('change');
        });
      };
      
      var recreateSelect = function () {
        // if (!element.select2Initialized) return;
        $timeout(function() {
          element.select2('destroy');
          element.select2();
        });
      };

      scope.$watch(ctrl, refreshSelect);
    }
  };
});

app.controller('MainCtrl', function($scope) {
  $scope.client = {
    primary_address: {},
    countries: []
  };
  
  
  $scope.newCountryList = [];
});

/* Styles go here */