无法通过ng-click将数据传递给指令

Question

我一直在使用Angular的components ，尽管我已经将ngCart注入了使用directives应用程序中。 我需要使用ngCart的checkout()函数传递表单中的数据（账单明细），以便将帐单明细和交易明细都包含在单个JSON中，以发送到后端。

我将计费对象作为checkout()函数的参数传递，但它记录为未定义。 如果将对象更改为字符串，它将记录到ngcartCheckout指令，因此从对象收集数据存在问题。

题

为什么对象无法传递给ngcartCheckout指令？

<div>
   <input ng-model="foo.name">
   <input ng-model="foo.sname">
</div>

<div ng-if="service=='http' || service == 'log'">
    <button ng-click="checkout(foo)">Checkout</button>
</div>

---

.directive('ngcartCheckout', [function(){
        return {
            restrict : 'E',
            controller : ('CartController', ['$rootScope', '$scope', 'ngCart', 'fulfilmentProvider', function($rootScope, $scope, ngCart, fulfilmentProvider) {
                $scope.ngCart = ngCart;

                $scope.checkout = function (foo) {
                    console.log(foo)
                }
            }]),
            scope: {
                service:'@', //REMOVED FROM TEMPLATE AS NOT RELEVANT
                settings:'=' //REMOVED FROM TEMPLATE AS NOT RELEVANT
            },
            transclude: true,
            templateUrl: function(element, attrs) {
               if ( typeof attrs.templateUrl == 'undefined' ) {
                  return 'p3sweb/app/components/checkout/views/ngCart/checkout.htm';
               } else {
                   return attrs.templateUrl;
               }
            }
        };
    }]);

Answer 1

foo从未声明（至少在您的示例中未声明）add

$scope.foo = {};

以上

$scope.ngCart = ngCart;

现在它将吐出一个空对象，如果您希望它为foo分配名称和sname，则需要将p标签更改为输入，然后在输入中键入名称

<input ng-model="foo.name">