Question

我是AngularJS的新手，我正在尝试使用ng-repeat的代码，但因为我需要将角度表达式传递给函数但是它无法在下面工作，我的代码是

HTML代码

     <div ng-controller="Profile as pro">
      <ul class="nav nav-tabs">
       <li ng-repeat="tabs in tabArray" 
           ng-class="{active: pro.tab==1}" 
           ng-click=" pro.setTab({{tabs.value}})">
         <a href="">{{tabs.name}}</a>
       </li>
      </ul>
     <div>

控制器代码

controller.controller('Profile', ['$scope',function ($scope) {
        $scope.tabArray = [
            {name:"Profile","value":1},
            {name:"Education","value":2},
            {name:"Work","value":3},
            {name:"About","value":4}
        ];
        this.tab=1;
        this.setTab = function(tabSelected){
            this.tab=tabSelected;
        };
     }]);

Answer 1

使用 ng-click ="pro.setTab(tabs.value)"

Answer 2

您的代码中只有问题出现在以下行中：

ng-click=" pro.setTab({{tabs.value}})" // don't use {{ and }} thing here, it is not needed

以下代码是固定版本：

ng-click="pro.setTab(tabs.value)" // only {{ and }} are removed and it works well

快乐帮助！

Answer 3

您现有的代码中存在一些错误 - ＆gt;

由于您正在使用 ControllerAs 语法，因此您应该使用variable中使用的controller，并在视图中引用所有变量。

此处，在您的模型的ng-repeat中，引用pro.tabArray。

在函数/方法调用时，无需传递 AngularExpressions 中的参数。

所以，请使用ng-click="pro.setTab(tabs.value)"，不要使用表达式。

HTML代码：

<li ng-repeat="tabs in pro.tabArray" ng-class="{'active': pro.tab==1}" ng-click="pro.setTab(tabs.value)"><a href="">{{tabs.name}}</a></li>

在您的JS中，您已使用$scope引用了一些varibales，而this引用了一些。与您的代码保持一致，不要混淆。

JS代码：

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

app.controller('Profile', function ($scope) {
    this.tabArray = [
              { name: "Profile", "value": 1 },
              { name: "Education", "value": 2 },
              { name: "Work", "value": 3 },
              { name: "About", "value": 4 }
    ];
    this.tab = 1;
    this.setTab = function (tabSelected) {
        this.tab = tabSelected;
    };
    $scope = this;
});

将角度表达式传递给函数

3 个答案: