angularjs - 数据绑定在指令中的事件中不起作用

Question

我无法让数据绑定在此指令中工作。当我在事件处理程序中更改变量时，变量未正确绑定，

我究竟做错了什么？>测试小提琴

var myApp = angular.module('myApp', [])
    .directive('inputTest', function () {
    return {
        restrict: 'E',
        template: '<div class="input-group">\
                    <input type="text" class="form-control" />\
                    <br>child scope: {{myValue}}\
                  </div>',
        scope: {
            myValue: '=',
        },
        link: function (scope, element, attrs) {
            $(element).on('click', function (e) {
                alert('c');
                scope.myValue = 'clicked';
            });
            scope.myValue = 'not clicked';
        },
    };
})

function MyCtrl($scope) {
    $scope.myValue = 'parent value';
}

HTML

<div ng-controller="MyCtrl">parent scope: {{myValue}}
    <input-test my-value="myValue"></input-test>
</div>

Answer 1

1. 不要忘记$scope.$apply()在事件处理程序结束时调用。

2. 由于原型继承的工作方式，第一级绑定可能无法按预期工作。如果您尝试了第一点但仍然没有结果，请尝试myValue更深层次：

   $scope.data.myValue = 'parent value';
   

   和：

   <input-test my-value="data.myValue"></input-test>