javascript - AngularJS - 绑定(bind)父级以触发子级的 Angular 方式

Question

我有以下标记:

<div class="parent">
    <div class="child">

我有两个指令，一个用于parent，一个用于child。现在，在 parent 上发生事件(例如单击)时，我希望在 child 上发生一些事情(例如单击)。

执行此操作的 jQuery 方法是:

app.directive('parent', function()
{
    return {
        restrict: 'C',
        link: function(scope, element, attrs)
        {
            element.bind('click', function()
            {
                element.find('.child').click();
            });
        }
    }
}   

如果我没有记错的话，Angular 的方法是更改​​ parent 中的范围，并在 child 中更改 $watch 的范围:

app.directive('parent', function()
{
    return {
        restrict: 'C',
        link: function(scope, element, attrs)
        {
            scope.childEvent = false; 

            element.bind('click', function()
            {
                scope.childEvent = true;
            });
        }
    }
}   

app.directive('child', function()
{
    return {
        restrict: 'C',
        link: function(scope, element, attrs)
        {
            scope.$watch('childEvent', function(value)
            {
                if (value) element.click();
            })
        }
    }
}   

有人可以告诉我哪种方法更好，为什么？第一种方法肯定更短，但似乎每个人都说 Angular 方式是第二种方法(所以我不使用 jQuery)。我想知道如果我使用jQuery方式会出现什么问题。

Answer 1

我认为，第二种变体是解决问题的“Angular 方式”。这是(如果您从 Angular 开发人员的 Angular 来看)无需手动操作 DOM 即可解决的解决方案。在我看来，这就是 AngularJS 的主要思想:停止手动操作 DOM——让 Angular 为你做这件事。