我从某个库中获得了一个自定义指令,该指令具有如下所示的指令:
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>
如此处Passing data to a custom directive in 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)
这里维护Having a hard time debugging error - Token '{' invalid key at column 2
所以我很困惑我如何将变量传递给我的自定义指令
答案 0 :(得分: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>
我建议使用双引号而不是单引号。