1 
<div ng-repeat="post in posts">
  <a e-form="review_link" ng-click="review_link.$show()" editable-text="post.review_link" buttons="no" blur="submit" e-placeholder="Leave blank to use default value">{{ post.url }}</a>
  <a e-form="title" ng-click="title.$show()" editable-text="post.title" buttons="no" blur="submit" e-placeholder="Leave blank to use default value">{{ post.title }}</a>
  <a e-form="author" ng-click="author.$show()" editable-text="post.author" buttons="no" blur="submit" e-placeholder="Leave blank to use default value">{{ post.author }}</a>
  <!-- other different widgets -->
</div>

私は次のようなことをしようとしていました:

<div ng-repeat="post in posts">
  <custom-directive field="field" ng-repeat="field in ['review_link', 'title', 'author']"></custom-directive>
  <!-- other different widgets -->
</div>

および指令で：

app.directive('customDirective', function() {
  return {
    restrict: 'E',
    scope: {
      field: '='
    },
    template: '<a e-form="{{field}}" ng-click="{{field}}.$show()" editable-text="post[{{field}}]" buttons="no" blur="submit" e-placeholder="Leave blank to use default value">{{ post.author }}</a>' 
  }
}

しかし、コンパイル構文エラーが発生しました

PD:例ではhttp://vitalets.github.io/angular-xeditable/#overviewを使用しています。

4

1 に答える 1

0

による構文エラーng-click="{{field}}.$show()"。

に変更し ng-click="field.$show()"ます。中括弧は必要ありませんng-repeat

さらに、ディレクティブのテンプレートからアクセスしようとしているようですpost(ディレクティブと共有されていないため、これは機能しません - スコープは分離されています)。

何をすべきか？次のように追加postしscopeます。

scope: {
  field: '=',
  post: '='
},

で行ったのと同じように、それをディレクティブに追加して渡しますfield。

<custom-directive field="field" post="post" ...

例: http://plnkr.co/edit/szDjDw3bnLtDSRr2O08H?p=preview

于 2014-10-08T22:06:09.130 に答える