标签: angularjs-ng-click

我在表行上有一个单击事件,在这一行中还有一个带有单击事件的删除按钮.当我单击删除按钮时,也会触发行上的单击事件.

这是我的代码.

<tbody>
  <tr ng-repeat="user in users" class="repeat-animation" ng-click="showUser(user, $index)">
    <td>{{user.firstname}}</td>
    <td>{{user.lastname}}</td>
    <td>{{user.email}}</td>
    <td><button class="btn red btn-sm" ng-click="deleteUser(user.id, $index)">Delete</button></td>
  </tr>
</tbody>

showUser当我单击表格单元格中的删除按钮时,如何防止触发事件？

我有一个ng-repeat像这样的简单循环:

<li ng-repeat='task in tasks'>
  <p> {{task.name}}
  <button ng-click="removeTask({{task.id}})">remove</button>
</li>

控制器中有一个功能$scope.removeTask(taskID).

据我所知,Angular将首先渲染视图并用{{task.id}}数字替换插值,然后,在click事件中,将评估ng-click字符串.

在这种情况下ng-click,完全得到预期,即:ng-click="removeTask(5)".但是......它没有做任何事情.

当然,我可以编写一个代码来task.id从$tasks数组甚至DOM中获取,但这似乎不像Angular方式.

那么,如何ng-click在ng-repeat循环内向指令添加动态内容呢？

假设您正在使用路线:

// bootstrap
myApp.config(['$routeProvider', '$locationProvider', function ($routeProvider, $locationProvider) {

    $routeProvider.when('/home', {
        templateUrl: 'partials/home.html',
        controller: 'HomeCtrl'
    });
    $routeProvider.when('/about', {
        templateUrl: 'partials/about.html',
        controller: 'AboutCtrl'
    });
...

在您的html中,您希望在单击按钮时导航到about页面.一种方法是

<a href="#/about">

...但似乎ng-click在这里也很有用.

1. 这个假设是否正确？使用ng-click而不是锚点？
2. 如果是这样,那将如何运作？IE:

<div ng-click="/about">

我想ng-click在运行时触发一个元素,如:

_ele.click();

要么

_ele.trigger('click', function());

如何才能做到这一点？

我正在尝试如何使用ngClick添加类.我已将我的代码上传到plunker上点击此处.看一下角度文档,我无法弄清楚它应该完成的确切方式.下面是我的代码片段.有人能引导我朝着正确的方向前进

 <div ng-show="isVisible" ng-class="{'selected': $index==selectedIndex}" class="block"></div>

调节器

var app = angular.module("MyApp", []);
app.controller("subNavController", function ($scope){

        $scope.toggle = function (){
            $scope.isVisible = ! $scope.isVisible;
        };

        $scope.isVisible = false;
    });

我知道ng-click如果我$event像这样传入对象,我可以访问click事件:

<button ng-click="myFunction($event)">Give me the $event</button>

<script>
  function myFunction (event) {
    typeof event !== "undefined" // true
  }
</script>

$event每次都必须明确传递,这有点烦人.ng-click默认情况下是否可以设置为以某种方式将其传递给函数？

我有多个元素在ng-click上具有相同的回调:

<button ng-click="doSomething()"></button>
<button ng-click="doSomething()"></button>
<button ng-click="doSomething()"></button>
<button ng-click="doSomething()"></button>

// In controller:
$scope.doSomething = function() {
  // How do I get a reference to the button that triggered the function?
};

如何获得对doSomething调用的对象的引用？(我需要删除它的attr)

我附上div了Angular ng-click指令.在鼠标悬停在此元素上时,鼠标指针不会更改.有没有办法通过CSS改变它？我知道我可以简单地附加一个锚标签,但我想知道是否可以这样做.

我想使用ng-click来执行多个表达式.我想在模型上设置一个值,并从中调用一个方法$scope,如下所示:

<a ng-click="navigation.book = book && bookSvc.showBook(book)" href="#{{book.id}}">{{book.title}}</a>

我在哪里&&分离了我想要执行的两个不同的表达式.我知道我可以添加一个在控制器中执行这两项操作的方法.我应该这样做,还是有办法直接从里面执行两个表达式ng-click？

在以下示例中:

  <li ng-repeat="item in items" ng-click="showItem(item)">
    <h3>{{item.title}}</h3>
    <button ng-click="remove(item)">Remove</button>
  </li>

当我点击按钮时,showItem()由于事件冒泡也会调用它.我知道我可以$event用来观察$event.currentTarget和做$event.stopPropagation()等等,但这非常难看.

顺便说一句.我不想停止传播button(在我的情况下button是一个twitter bootstrap dopdown/button- 这只是一个例子)

showItem()当我点击remove按钮时,如何停止调用？

编辑 丑陋的解决方案是:

function remove(item,$event){
  $event.originalEvent.prevent = true;
  // rest of the code
}

function showItem(item,$event){
  if($event.originalEvent.prevent)return;
  // rest of the code
}