帶有ng-attr的Angular指令綁定到模型

Question

我想將一個屬性雙重綁定到指令范圍，並從外部更改該屬性，它會更改指令內的某些內容。

<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>

編輯：

此示例按預期工作：在plunker中預覽

Answer 1

我假設ng-attr-hidden需要一個角度表達式，但是你給它一個對象定義。
嘗試刪除{{}}

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

帶有ng-attr的Angular指令綁定到模型

問題描述

編輯：

1 個解決方案

解決方案1
7 已采納 2014-01-16 20:32:47

帶有ng-attr的Angular指令綁定到模型

問題描述

編輯：

1 個解決方案

解決方案1 7 已采納 2014-01-16 20:32:47

解決方案1
7 已采納 2014-01-16 20:32:47