Question

我正在用html5和angular js编写代码。我在使用空格传递参数时遇到了问题。这是我的代码：

angular.module('MyApp', [])
    controller('MyCtrl', function($scope) {
      
      $scope.validate = function(description,code) {
        alert(description,code);
      }
      });

<!DOCTYPE html>
<html>
<body ng-app="MyApp">
    <div ng-repeat="x in allItem.items" class="col-75" ng-controller="MyCtrl">
   <a href="#" ng-click="validate({{x.itemDesc}},{{x.itemCode}})">
   <div class="card item center">{{x.itemName}}
   </div></a>
    </div>
  </body>
    </html>

JSON格式是这样的 Json包含

allItem
  {
    items
        {
          itemName: "egg",
          itemDesc: "Egg is very delicious",
          itemCode: "EGG"
          }

         {
           itemName: "Tomato",
           itemDescr: "Tomato's skin contains vitamins",
           itemCode: "TMT"
           }
    }

我无法传递参数。我不知道如何传递包含空格和引号（'）的文本。任何人都可以帮助我

Answer 1

您的Json需要是一个数组，跳过href =“＃”并且您不需要在ng-click内绑定。下面的代码完全正常运行。

angular.module('MyApp', [])
    .controller('MyCtrl', function($scope) {


        $scope.allItem =
        {
            items:[
                {
                    itemName: "egg",
                    itemDesc: "Egg is very delicious",
                    itemCode: "EGG"
                },

                {
                    itemName: "Tomato",
                    itemDesc: "Tomato's skin contains vitamins",
                    itemCode: "TMT"
                }
]
        };


        $scope.validate = function(description, code) {

            console.log(description,'-', code);
        };
});

<!doctype html>
<html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
</head>
<body ng-app="MyApp" ng-controller="MyCtrl">
 <br/>
       
        <div ng-repeat="x in allItem.items" class="col-75">
            <a ng-click="validate(x.itemDesc, x.itemCode)">
                <div class="card item center">{{x.itemName}}
                </div>
            </a>
        </div>
</body>
</html>

传递参数与空间功能

1 个答案: