在与 ng-repeat 相同的标签上使用 ng-click，并使用来自 ng-repeat 范围的参数

Question

我有一个 select 列表，其中填充了对象列表中的 ng-repeat 标记。每个对象的名称属性都显示在标记中。单击其中一个标签时，我想使用 ng-click 调用一个函数，将这些对象的 url 属性作为参数传递。

填充部分工作正常，但参数的传递似乎不起作用。代码来了：

html：

<div ng-controller="TaskChartCtrl">
  <select>
    <option ng-repeat="project in projectList" ng-click="populateGraphs(project.url)">{{ project.name }}</option>
  </select>
</div>

来自控制器的相关部分：

 myApp.controller("TaskChartCtrl", ["$scope", "$http", function ($scope, $http) {    

    $scope.projectList = {};

    $http.get('URL', config).then(function(response) {
        $scope.projectList = response.data.projects;
    }, function(errResponse) {
        console.error("Error fetching projectList");
    });


    $scope.populateGraphs = function(projectUrl) {
      //FUNCTION CODE GOES HERE
    }
}]);

谁能指出我的错误所在的正确方向？

非常感谢！

Answer 1

由于您正在使用 <select>，因此您需要使用 ng-change 而不是 ng-click

对于 <select>

也使用 ng-options 而不是 ng-repeat

参考：Select options through ng-click is not working in chrome browser using AngularJS

试试这个，在更改时在 populateGraphs 函数中设置 selectedProject

<select ng-model="selectedProject" ng-options="project as project.name for project in projectList" ng-init="selectedProject = 'someProjectName'" ng-change="populateGraphs(selectedProject.url)">
<option value="">Select A Project</option>
</select>

在与 ng-repeat 相同的标签上使用 ng-click，并使用来自 ng-repeat 范围的参数

Using ng-click on the same tag as ng-repeat with argument from ng-repeat scope

javascript

scope

angularjs

ng-repeat