将按钮值传递给使用角度的函数

我有一个简单的nav-bar，其中当我点击标签时，我需要将标签的值传递给一个方法。
我试过这个，但得到undefined。将按钮值传递给使用角度的函数

<body ng-app="myApp" ng-controller="myCtrl"> 
<div> 
<ul><li ng-click="displayValue(home)"><a data-toggle="tab" href="#"><span class="tabName" ng-model="home">Home</span></a></li></ul> 
</div> 
</body> 

<script> 
var app=angular 
      .module('myApp', []) 
      .controller('myCtrl', function ($scope) { 
       $scope.displayValue= function (val) { 
        alert(val) 
       } 
      }) 
</script>

在这里，我需要通过home到一个方法。

来源

2017-06-16 krish

告诉我们你的控制器 – Sajeetharan

只是通过您的数据串ng-click="displayValue('home')。
对于多个选项卡，您也可以像这样传递。

来源

2017-06-16 05:33:37 user7397787

谢谢..我明白了 – krish

您应该正确使用你的函数名，它应该是goSearch，而不是displayValue

<li ng-click="goSearch(home)">

编辑

如果你想在NG-模型变量传递给函数，您需要初始化该值。

$scope.home = "Home"; 
$scope.goSearch = function (val) { 
      alert($scope.home); 
}

DEMO

var app = angular.module('myApp', []); 
 
app.controller('myCtrl', function($scope) { 
 
    $scope.home = "Home"; 
 
    $scope.goSearch = function (home) 
 
    { 
 
     console.log($scope.home); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div data-ng-app='myApp' data-ng-controller='myCtrl'> 
 
<li ng-click="goSearch()"><a data-toggle="tab" href="#"><span class="tabName" ng-model="home">{{home}}</span></a></li> 
 
</div>

来源

2017-06-16 05:26:52 Sajeetharan

对不起，请检查我更新的问题 – krish

'ng-model =“home”'on'a'元素？我看不到这将如何提醒除undefined –

你不能传递文本从视图参数。如果你定义了ng-model，那么你可以直接在控制器中访问它。这是更新的代码。我认为这会清除你所有的疑问。

var app=angular.module('myApp', []) 
 
    app.controller('myCtrl', function ($scope) { 
 
     $scope.home = "Home"; 
 
     $scope.displayValue = function (val) { 
 
      alert($scope.home); 
 
     } 
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<div ng-app="myApp" ng-controller="myCtrl"> 
 
<ul><li ng-click="displayValue(home)"><a data-toggle="tab" href="#"><span class="tabName" ng-model="home">{{home}}</span></a></li></ul> 
 
</div>

来源

2017-06-16 05:29:29

以外的其他任何东西如果我有多个选项卡意味着什么？那么解决方案是什么？ – krish

多个标签是用ng-repeat生成的吗？ – AKMorris

@krish这是更新的小提琴这将清除您对多个选项卡的疑问。 https://jsfiddle.net/biswajit_rout/f1o0jj58/6/ –

好吧，首先您需要为使用双大括号一个范围变量Home参考 “{{家}}”。然后你需要在你的控制器中定义这个范围变量。下面是代码：https://jsfiddle.net/AKMorris/ogpcvze7/

HTML

<div data-ng-app='myApp' data-ng-controller='myCtrl'> 
<li ng-click="displayValue()"><a data-toggle="tab" href="#"><span class="tabName" ng-model="home">{{home}}</span></a></li> 
</div>

的Javascript

var app = angular.module('myApp', []); 
app.controller('myCtrl', function($scope) { 
     $scope.home = "Home"; 
     $scope.displayValue = function (home) 
    { 
     console.log($scope.home); 
    } 
});

来源

2017-06-16 05:30:56 AKMorris

将按钮值传递给使用角度的函数

回答

相关问题