Question

我对AngularJS很新，我尝试实现以下内容：点击一些外部元素，点击它的子元素我想获得外部元素的一些属性。

在jQuery中，当我点击子元素时，这似乎很容易冒泡。在Angular中，我在外部元素上放置“ng-click”的函数被调用，但是无法获取该属性... 我把我的例子放在Angular和jQuery中：http://www.allcontrasts.com/external/angular-jquery/index.html

批评性代码如下：

HTML：

<body ng-app="testApp" ng-controller="testController" >
  <div class="angulardiv" ng-click="myAlert($event);" data-id="321">ANGULAR
    <div class="sublement">
        Subelement
    </div>
  </div>
  <div class="jquerydiv" data-id="321">JQUERY
    <div class="sublement">
        Subelement
    </div>
  </div>
</body>

角码：

var app = angular.module('testApp', []);
app.controller('testController', function($scope) {
    $scope.myAlert = function(event) {
        var elem = angular.element(event.target);
        var dataId = elem.attr('data-id');
        alert(dataId);
    }
});

jQuery的：

$(document).ready(function() {
    $('.jquerydiv').click(function() {
        alert($(this).attr('data-id'));
    })
});

如何使用Angular实现jQuery在这种情况下的作用？

Answer 1

好的，在这种情况下，灵魂很容易，我可以将我的HTML更改为：

<div class="angulardiv" ng-click="myAlert(321);">ANGULAR
  <div class="sublement">
     Subelement
  </div>
</div>

...只需将所需的ID作为参数直接传递给函数。

然后将Angular代码更改为：

var app = angular.module('testApp', []);
app.controller('testController', function($scope) {
    $scope.myAlert = function(obj) {
        alert(obj);
    }
});

使用AngularJS获取父容器的DOM元素属性

1 个答案: