Question

我有一张信用卡列表，供用户选择编辑。信用卡表单绑定到列表，如果他们选择在给定卡上编辑，则显示表单。信用卡表格是一个自定义指令。用户还可以添加新卡。如果信用卡表格可见，则需要通常的字段，但如果信用卡表格不可见则不需要/验证。可见性通过ng-show进行管理。

以下是指令用法的简化版本。指令本身就像你期望的那样简单。

<div data-ng-repeat="profile in paymentProfiles" data-ng-show="profile.PaymentProfileGuid == SelectedPaymentProfile && options.enableCreditCardEdit">
    <creditcard-widget title="Enter your Card Information" 
          card="profile" isrequired="profile.PaymentProfileGuid == SelectedPaymentProfile && options.enableCreditCardEdit"></creditcard-widget>
</div>

我尝试以双向，单向和文本方式绑定isrequired。它仅作为文本工作，并且只有在我传递值而不是表达式时才有效。如何将标志传递给至少是单向数据绑定的指令？

修改我试过用“@”，“＆amp;”和“=”传递参数。我试图减少足够的东西来发布一个jsfiddle或plukr链接。这是指令js：

.directive('creditcardWidget', function () {
    return {
        controller: 'CreditcardWidgetController',
        restrict: 'E, A',
        templateUrl: '/app/views/partials/creditcardWidget.html',
        scope: {
            card: "=card",
            types: "=",
            months: "=months",
            years: "=years",
            title: "@",
            opt: "&",
            prefix: "@",
            isrequired: "&"
        }
    };
});

编辑2

这是一个简化的plnkr

Answer 1

这是一个使用&的工作fiddle。看看与你的不同之处。

app.directive('creditcardWidget', function () {
    return {
        restrict: 'EA',
        template: '<div>isrequired={{isrequired()}}</div>',
        scope: {
            // ...
            isrequired: "&"
        },
        link: function(scope, element, attrs) {
            console.log('link: isrequired=', scope.isrequired());
        }
    };
});

function MyCtrl($scope) {
    $scope.paymentProfiles = [
       { PaymentProfileGuid: 22}
    ];
    $scope.SelectedPaymentProfile = 22;
    $scope.options = {enableCreditCardEdit: true};
}

有条件地要求指令中的字段

1 个答案: