Question

我是AngularJS的新手，在学习它的过程中，我发现了一篇关于如何在HTML标记中嵌套和继承范围的精彩文章：Understanding Scopes

此外，我通过这个Plunker来了解上述帖子的内容。

我创建了这个JSFiddle来理解上述概念。

HTML：

<body ng-app="myApp">
    <h1>Hello AngularJS!</h1>
    <div ng-controller="myCtrl">{{hello}}
        <div anchor-link> 
            <a href="javascript:;">click me</a>
            <div ng-show="t.show">show me</div>
            <div ng-hide="t.show">hide me</div>
        </div>
    </div>
</body>

JS：

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

app.controller('myCtrl', function ($scope) {
    $scope.hello = 'Hello World!';
    $scope.t = {
        show: true
    };
});

app.directive('anchorLink', function () {
    return {
        restrict: 'EA',
        link: function (scope, elem, attr) {
            elem.on('click', function () {
                 scope.t.show = !scope.t.show;
            });
        }
    };
});

现在我的问题：

为什么双向数据绑定在我的小提琴中起作用？我的自定义指令的范围是否应该从其父级（即控制器）继承？
如果我在控制器范围内使用$scope.t作为对象。然后为什么不切换＆＃34;告诉我＆＃34;并且＆＃34;隐藏我＆＃34; DIVS？我也尝试在我的自定义指令中使用scope: true，但它仍然无法正常工作。
是因为我的链接功能中的scope没有原型继承吗？
它是否真的改变了父范围的$scope.t对象？

Answer 1

所以你需要做的是：

http://jsfiddle.net/DkFx9/

这里发生的是你正在使用jQuery的click事件处理程序来处理click事件并更改处理程序中的scope变量。这个问题是，角度无法知道范围内的某些内容发生了变化，因此需要更新视图。

通常情况下，使用像ng-click="t.show = !t.show"这样的角度指令执行类似操作时，angular会知道某些甚至是通过角度进行的，并且它会运行摘要循环来执行脏检查并更新相关视图。 / p>

在你的情况下，我们必须告诉角度发生了什么，它必须运行摘要循环。 scope.$apply获取您要执行的代码段，然后请求angular运行摘要循环并更新需要更新的视图。

希望有所帮助。

与自定义指令范围的2路数据绑定

1 个答案: