如何将值从 angularjs 模板传递给控制器​​？

Question

HTML code:

   <tr ng-repeat="x in products"> 
   <a href="#!/{{x.product_name}}" class="button"> {{x.product_name}}</a> 

i just want to get this {{x.product_name}} , in angularjs scope. means, if i click on any of the button, it should pass the x.product_name to angularjs in controller. How to do this?

I am new to angularjs. Thank you in advance.

Answer 1

1. Put your code inside ng-app and assign ng-controller .
2. Make sure to add products property on $scope of controller
3. Make sure each product contains product_name

 angular.module('myApp', []) .controller('myController', ['$scope', function myController($scope) { $scope.products = [{ product_name: 'cellphone' }, { product_name: 'laptops' }, { product_name: 'desktops' }]; $scope.handleClick = (productName) => { console.log(`${productName} clicked`); } }]);

 <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.5/angular.min.js"></script> <div ng-app="myApp" ng-controller="myController"> <table> <tr ng-repeat="x in products"> <td> <a href="#!/{{x.product_name}}" class="button" ng-click="handleClick(x.product_name)"> {{x.product_name}}</a> </td> </table> </div>