Question

我有以下控制器：

app.controller('TestController', function($scope) {
  $scope.tests = [{
      name: 'Name 1',
      description: 'Some Description',
      actionHandler: function() {
        alert('Action Handler called');
      }
    },
    ...
  ];
});

在我的html文件中，我像这样执行 ng-repeat ：

<div ng-repeat="test in tests">
  <p>{{test.name}}</p>
  <p>{{test.description}}</p>
  <a ng-click="{{test.actionHandler}}">Click me</a>
</div>

它并没有真正起作用。我也试过了。

<a ng-click="test.actionHandler">Click me</a>

和

 <a ng-click="test.actionHandler()">Click me</a>

但似乎都没有用。知道如何在 ng-repeat 中调用对象的函数吗？

谢谢，xCoder。

Answer 1

你的第三次刺伤是正确的contextDestroy形式。也许您可以尝试在控制器GuiceServletContextListener中的$ scope旁边添加$ window，并将警报调用更改为test.actionHandler() ...

Answer 2

只需删除{{}}并调用ng-click

中的功能即可

<a ng-click="test.actionHandler()">Click me</a>

的 DEMO

Answer 3

如果我是你，我会这样做

对于html：

<div ng-repeat="test in tests">
   <p ng-bind="test.name"></p>
   <p ng-bind="test.description"></p>
   <a ng-click="test.actionHandler($index)">Click me</a>
</div>

对于控制器

app.controller('TestController',function($scope) {
   $scope.tests = [
      {
         name: 'Name 1',
         description: 'Some Description',
      },
   ];

   scope.actionHandler = function(index) 
   {
      alert('Action Handler called for'+$scope.tests[index]['name']);
   }

});

使用ng-bind代替花括号。这是我给你的小费。

Answer 4

我会在控制器中创建一个新的事件处理程序：

Public Class MainClass
    Private Sub asd()
        ' does not work:
        AnotherClass.WriteSomething(VAL_LIST.VAL_1, DateTime.Now.ToString)
    End Sub
End Class

Public Class AnotherClass
    Enum VAL_LIST
        VAL_1
        VAL_2
        VAL_3
    End Enum

    Public Sub WriteSomething(ByVal myVal As VAL_LIST, ByVal myString As String)
        Dim _string As String = "Today is " & myString
    End Sub
End Class

然后您的链接将是：

app.controller('TestController',function($scope) {

   $scope.handleClick = function(){
       alert('Action Handler called');   
   }

});

如果您需要特定测试的处理程序，那么只需将id（例如）传递给处理程序。

Answer 5

仅删除花括号并添加括号()。

ng-click="test.actionHandler()"

这样的事情：

(function() {
  angular.module("myApp", []).controller("Controller", ["$scope",
    function($scope) {
      $scope.tests = [{
        name: "Name 1",
        description: "Some Description...",
        actionHandler: function() {
          alert("Action Handler called");
          console.log(this);
        }
      }, {
        name: "Name 2",
        description: "Some Description 2...",
        actionHandler: function() {
          alert("Action Handler called");
          console.log(this);
        }
      }];
    }
  ]);
})();

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.21/angular.min.js"></script>
<div data-ng-app="myApp">
  <div data-ng-controller="Controller">
    <ul>
      <li data-ng-repeat="test in tests">{{test.name}}
        <br />
        <button data-ng-click="test.actionHandler()" type="button">Test</button>
      </li>
    </ul>
  </div>
</div>

Live demo

AngularJS在ng-repeat中调用对象的函数

5 个答案: