javascript - 具有输入范围的属性指令会破坏 ng-model 与父控制器的绑定

Question

我有一个带有控制器的 div 元素。div 元素包含一个带有 ng-model 绑定到对象的 input 元素。输入元素也有一个属性指令。

如果我向属性指令添加范围，控制器中的 ng-model 绑定就会中断。有没有办法让它工作，或者我应该寻找解决方法？

您可以在http://jsbin.com/IvIFobU/4/看到运行的代码。

HTML

<p>The input field below should say "foobar":</p>
<div ng-controller="fooController">
  <input ng-model="object.string" foo-attribute="callback">
</div>

JavaScript

var app = angular.module('app', []);

app.controller("fooController", function($scope) {
      $scope.object = {
        string: 'foobar'
      };

      $scope.callback = function() {
        console.log('callback');
      };
});

app.directive('fooAttribute', function() {
  return {
    restrict: 'A',

    // This scope breaks the ng-model on the input... 
    scope: {
      callback: '&fooAttribute'
    },

    link: function(scope, element, attr) {
      element.css('background', 'lightblue');

      scope.callback();
    }
  };
});