Two way binding with controller in directive with isolated scope
<p>Im developing a directive, where when the user will click UPDATE, a field for EmployeeId will show up, and that employeeId field on the directive should be bound directly to the controller when changes. If i isolate the scope it doesn't change the controller employeeId, if i dont, than all directives gets toggled.</p>

<p>Plunker: <a href="https://plnkr.co/edit/aq06WnfniN51iR7ZtFLc?p=preview" rel="nofollow noreferrer">https://plnkr.co/edit/aq06WnfniN51iR7ZtFLc?p=preview</a></p>

<p>code:</p>

<pre><code>var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope) {
    $scope.employeeId = 'Josh'
    $scope.employeePin = '1234'

    $scope.updateFields = function() {
        alert(1);
    }
});

app.directive('crudEmp', function($parse) {
    var html =  '&lt;div class="form-inline"&gt;\
                    &lt;input type="text" class="form-control"\
                        placeholder="Employe ID"\
                        ng-model="employeeId"\
                        required\
                        ng-show="isEditing"/&gt;\
                    &lt;input type="password" class="form-control"\
                        placeholder="Employe PIN"\
                        ng-model="employeePin"\
                        ng-show="user.AdminSecurity &amp;&amp; isEditing"\
                        ng-required="user.AdminSecurity"\
                        disabled/&gt;\
                    &lt;div class="col-md-12 text-right noPadding pt10 operationButtons" id="opBtn"&gt;\
                        &lt;div class="col-md-12 noPadding" ng-hide="isEditing"&gt;\
                            &lt;button class="btn btn-info" ng-click="toggleEditing()"&gt;Edit&lt;/button&gt;\
                        &lt;/div&gt;\
                        &lt;div class="col-md-12 text-right noPadding" ng-hide="!isEditing"&gt;\
                            &lt;button class="btn btn-success mr80 updateBtn" ng-click="ctrl.onClick(); toggleEditing()" ng-disabled="ctrl.valid"&gt;Update&lt;/button&gt;\
                            &lt;button class="btn btn-warning" ng-click="toggleEditing()"&gt;Cancel&lt;/button&gt;\
                        &lt;/div&gt;\
                    &lt;/div&gt;';

    return {
        restrict: 'E',
        template: html,
        replace: true,
        bindToController: {
            employeeId: '=',
            employeePin: '=',
            valid: '=',
            onClick: '&amp;',
        },
//      scope: true,   // When i make the scope true, it doesnt change the EmployeeId defined in the controller
        link: function(scope, element, attr){
            scope.onClick = attr.onClick;

            scope.toggleEditing = function() {
                scope.isEditing = !scope.isEditing;
                if(scope.isEditing){
                    element.closest('form').find(':input:not(.operationButtons button)').attr('disabled', false);
                    var getAllInputs = element.closest('form').find(':input').filter(':visible:enabled');
                    if(getAllInputs[0]){
                        getAllInputs[0].focus();
                    }
                }else{
                    element.closest('form').find(':input:not(.operationButtons button)').attr('disabled', true);
                }
            };
        },
        controllerAs: 'ctrl',
        controller: function($scope) {
            var ctrl = this;

            ctrl.onClick = function() {
                $scope.$eval($scope.onClick);
            };
        },
    };
});
</code></pre>