Question

让我们说我有一个简单的指令：

//Second include level (L2)
//Inside header.ejs
<% if (req.user) { %> //---> req.user undefined
   <% include ../partials/login %>
<% } else { %>
   <% include ../partials/usermenu %>
<% } %>

所以这一切都是通过传递一些数据自动创建元标记：

HTML

app.directive('seo', function() {
    return {
        template: '<meta ng-repeat="tag in data" {{tag.attribute}}="{{tag.name}}" content="{{tag.content}}" />',
        scope : {
            data: '='
        },
        restrict: 'A',
        replace:true
    }
});

DATA

<meta seo data="data" />

因此，目标是创建一个模板，吐出这样的东西：

[{
    attribute : 'name',
    content : 'foo',
    name : 'image'
},
{
    attribute : 'property',
    content : 'bar',
    name : 'title'
}];

如何使用Angularjs动态更改属性，显然我使用<meta class="ng-scope" ng-repeat="tag in data" name="image" content="foo" seo data="data"> <meta class="ng-scope" ng-repeat="tag in data" property="title" content="bar" seo data="data">作为等号之前的特定属性的方法不起作用。

Answer 1

尝试双指令方法。

第一个（seo）将使用ng-repeat进行迭代，并且在每次迭代中将当前tag个对象传递给第二个（seo-tag）。第二个将根据对象属性修改元素属性。

示例：

app.directive('seo', function() {
  return {
    template: '<meta ng-repeat="tag in data" seo-tag tag="tag" />',
    scope : {
      data: '='
    },
    restrict: 'A',
    replace: true
  }
});

app.directive('seoTag', function() {
  return {
    scope : {
      tag: '='
    },
    restrict: 'A',
    replace: true,
    link: function (scope, elem, attrs) {
        attrs.$set(attrs.$normalize(scope.tag.attribute), scope.tag.content);
    }
  }
});

这段代码并不完美，但我认为它是一个很好的基础。

这doc可能会有所帮助。

编辑：

我甚至会跳过seo指令，只使用ng-repeat和seo-tag。它有两个层次太复杂，但代码应该很简单：

<meta ng-repeat="tag in data" seo-tag tag="tag" />

在模板中。

在ng-repeat循环或后循环期间更改属性？

1 个答案: