使用ng-click在与ng-repeat相同的标签上使用ng-repeat作用域的参数

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

本文关键字:ng-repeat 作用域 参数 标签 ng-click 使用 在与      更新时间:2023-09-26

我有一个选择列表,其中填充了一个来自对象列表的ng-repeat标记。每个对象的name属性都显示在标记中。在点击其中一个标签时,我想用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
    }
}]);
谁能给我指出我的错误在哪里吗?

非常感谢!

既然您使用的是<select>,那么您需要使用ng-change而不是ng-click

ng-options代替ng-repeat代替<select>

参考:通过ng-click选择选项在使用AngularJS的chrome浏览器中不起作用

试试这个,在修改

时在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>