AngularJS 使用 ng-click 调用控制器内的函数

Posted 2023-02-19

【中文标题】AngularJS 使用 ng-click 调用控制器内的函数

【英文标题】：AngularJS calling a function inside a controller with ng-click

【发布时间】：2014-07-06 03:24:59

【问题描述】：

我在让控制器中的函数正常工作时遇到问题。

鉴于以下部分：

<div ng-controller="KundeDetailCtrl"><table class="table table-hover">
    <thead>
    <tr>
        <th>Name</th>
        <th>InstallationsID</th>
    </tr>
    </thead>
    <tbody  >

    <tr data-ng-repeat="mandant in kunde.mandanten" ng-click="getMandant(mandant)" >

        <td> mandant.name</td>
        <td>mandant.id</td>

    </tr>
    </tbody>


</table></div>

我希望能够单击一行并在我的控制器中调用相应的函数：

var AppControllers = angular.module('AppControllers', []);


AppControllers.controller('KundeDetailCtrl', ['$scope', '$routeParams', 'Kunde',
  function($scope, $routeParams, Kunde)  
$scope.kunde = Kunde.get(kundeId: $routeParams.kundeId, function(kunde) 

);

  $scope.getMandant = function(id)

      for(var i= 0, l=$scope.kunde.mandanten.length; i<l; i++)
          if($scope.kunde.mandanten[i].id == "id")
          
              $scope.mandant = $scope.kunde.mandanten[i];

          
      
      Location.href='index.html#/kunden/kunde._id/module'
  ;


  ]);

实际上，我只想知道点击了哪一行，并将点击行的对象交给下一个应该显示其他数据的部分。

ng-click 似乎根本没有做任何事情。在控制台中我只看到getMandant: null

谁能帮我解决这个问题？

【问题讨论】：

你需要知道ngRepeat中行的$index吗？

在您的 ng-repeat 中，您传入整个对象，但您使用它与 id 进行比较。您的比较不应该在 mandant.id 上吗？或者在你的情况下，因为调用参数 id， id.id ？或者您可以保持功能原样，但仅从您的 ng-click 发送 mandant.id

$scope.getMandant = function(obj) console.log(obj) 这会在 ng-click 上返回 null 吗？

控制台返回正确的 id（在我更正了 thsorens 建议的代码之后），但仍然没有发生 Location.href。

它在一定程度上起作用了：我设法将所有内容都发送到控制台，但 $scope.mandant 和 getMandant 在新的部分 html 中仍然为空。你有什么建议吗？

【参考方案1】：

您似乎正在将授权列表中的 id 与字符串“id”进行比较，而不是对象 id：

if($scope.kunde.mandanten[i].id == "id")

您还应该考虑使用 === 而不是 ==，这是在 javascript 中比较事物的首选方式。

您似乎正在重定向到 Angular 应用程序中的另一个视图，有什么理由不使用 $location 服务？