angularjs – 将ng-attr绑定到模型的Angular指令

发布时间：2020-12-17 17:19:55 所属栏目：安全来源：网络整理

导读：All code and preview in plunker 我想将属性双重绑定到指令范围并从外部更改该属性它改变了指令中的内容. body ng-app="paneApp" ng-controller="AppCtrl" div class="btn-group" button type="button" class="btn btn-primary" ng-model="pane.a" btn-che

All code and preview in plunker

我想将属性双重绑定到指令范围并从外部更改该属性
它改变了指令中的内容.

<body ng-app="paneApp" ng-controller="AppCtrl">

  <div class="btn-group">
    <button type="button" class="btn btn-primary" ng-model="pane.a" btn-checkbox>A</button>
    <button type="button" class="btn btn-primary" ng-model="pane.b" btn-checkbox>B</button>
    <button type="button" class="btn btn-primary" ng-model="pane.c" btn-checkbox>C</button>
    <button type="button" class="btn btn-primary" ng-model="pane.d" btn-checkbox>D</button>
  </div> 

  Visible: {{pane.a}} {{pane.b}} {{pane.c}} {{pane.d}}

  <pane-container>
    <pane ng-attr-hidden="{{pane.a}}">A</pane>
    <pane>B</pane> 
    <pane>C</pane>
    <pane>D</pane>
  </pane-container>
</body>

这里的错误是：

Error: [$parse:syntax] Syntax Error: Token 'pane.a' is unexpected,expecting [:] at column 3 of the expression [{{pane.a}}] starting at [pane.a}}].

如果没有在attirbute中使用表达式,则所有表达式都按预期工作：

<pane ng-attr-hidden="{{pane.a}}">A</pane>

编辑：

此示例按预期工作：preview in plunker

解决方法

我假设ng-attr-hidden需要一个角度表达式,但是你给它一个对象定义.
尝试删除{{}}

<pane ng-attr-hidden="pane.a">A</pane>

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!