-1

我从某个具有以下隐含指令的库中获得了一个自定义指令：

var directive = {
            restrict: 'E',
            replace: true,
            scope: {
                size: '@',
                id: '@toggleId',
                ngModel: '=',
                isDisabled: '@',
                csChange: '&',
                csTrueValue: '@',
                csFalseValue: '@',
            },
            template: ".......",
        };

因为它在 isDisabled 中使用了范围 @ 的某些属性，所以我提供的模板如下：

<xa-ya-za toggle-id='x{{ vm.x }}' is-disabled='{{vm.p.q}}' ng-model='vm.y' name='thresholdToggle' size='small' ng-click='vm.n($event)'></xa-ya-za>

如此处所述将数据传递给AngularJS中的自定义指令

但它会引发如下错误：

Error: [$parse:syntax] Syntax Error: Token '{' invalid key at column 2 of the expression [{{vm.p.q}}] starting at [{vm.p.q}}].
http://errors.angularjs.org/1.6.5/$parse/syntax?p0=%7B&p1=invalid%20key&p2=2&p3=%7B%7Bvm.selected.onlythreshold%7D%7D&p4=%7Bvm.selected.onlythreshold%7D%7D
    at a-third-party.min.js:1
    at AST.throwError (a-third-party.min.js:1)
    at AST.object (a-third-party.min.js:1)
    at AST.primary (a-third-party.min.js:1)
    at AST.unary (a-third-party.min.js:1)
    at AST.multiplicative (a-third-party.min.js:1)
    at AST.additive (a-third-party.min.js:1)
    at AST.relational (a-third-party.min.js:1)
    at AST.equality (a-third-party.min.js:1)
    at AST.logicalAND (a-third-party.min.js:1)

正如此处维护的那样，很难调试错误-第 2 列的令牌“{”无效键

所以我很困惑如何将变量传递给我的自定义指令

4

1 回答 1

2

您的 html 中缺少引号

<xa-ya-za toggle-id='x{{ vm.x }}' is-disabled={{vm.p.q}} ng-model='vm.y' name='thresholdToggle' size='small' ng-click='vm.n($event)'></xa-ya-za>

应该

<xa-ya-za toggle-id='x{{ vm.x }}' is-disabled='{{vm.p.q}}' ng-model='vm.y' name='thresholdToggle' size='small' ng-click='vm.n($event)'></xa-ya-za>

我建议使用双引号而不是单引号。

于 2017-11-07T13:06:39.010 回答