Angular 指令属性未传递到范围

Question

我的 angular 指令的参数没有被传递到范围内：

app.directive('sectionLeft', function() {
  return {
    restrict:'E',
    scope: {
       sectionContent: '=',
       sectionImg: '='
    },
    templateUrl: 'partials/section_left.html'
  };
});

app.directive('sectionRight', function() {
  return {
    restrict:'E',
    scope: {
       sectionContent: '=',
       sectionImg: '='
    },
    templateUrl: 'partials/section_right.html'
  };
});

他们是从这里呼叫的：

<div ng-repeat="content in data.home">
   <section-left ng-if="$even"  sectionContent="{{content}}" sectionImg="http://placehold.it/700x450"></div>
   <section-right ng-if="$odd" sectionContent="{{content}}" sectionImg="http://placehold.it/700x450"></div>
</div>

看起来像这样：

<div class="section">
    <div class="container">
        <div class="row">
            <div class="col-lg-6 col-md-6 col-sm-6">
                {{sectionContent}}
            </div>
            <div class="col-lg-6 col-md-6 col-sm-6">
                <img class="img-responsive" src="{{sectionImg}}">
            </div>
        </div>
    </div>
</div>

结果只是一个空白 space，没有任何内容，但我可以看到在指令元素上设置了属性。怎么回事？

提前致谢！

Answer 1

需要删除 {{}} 以在隔离范围内使用 = 将范围变量传递给指令。

section-content="content"

这意味着 2 方式绑定将绑定到名为 content

的父作用域变量

Angular 指令属性未传递到范围

Angular directive attributes not being passed into scope

javascript

arguments

angularjs

angularjs-directive

angularjs-scope