在重複循環或後循環期間更改屬性？

比方說，我有一個簡單的指令，像這樣：在重複循環或後循環期間更改屬性？

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 
    } 
});

因此，所有這樣做是創建meta標籤自動傳遞給它的一些數據：

HTML

<meta seo data="data" />

DATA

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

所以我們的目標是創建一個模板spi TS了這樣的事情：

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

我如何可以動態地改變與Angularjs屬性，顯然這種方法我已使用{{tag.attribute}}作爲特定屬性之前等號不起作用。

來源

2015-12-16 Shannon Hochkins

我認爲最好的方法是使用兩個指令。首先會執行ng-repeat並將標籤對象傳遞給另一個。另一個將使用標籤對象並在'link'函數中設置屬性。我會盡快舉出一個例子。 – scareddragon

嘗試雙指令方法。

第一個（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); 
    } 
    } 
});

此代碼是不完美的，但我認爲這是一個良好的基礎。

This doc會有幫助。

編輯：

我甚至會跳過seo指令，只使用ng-repeat與seo-tag。它太複雜，有兩個級別，而且代碼應該很簡單：

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

in template。

來源

2015-12-16 23:42:49 scareddragon

輝煌而優雅。謝謝堆！ –

我可能會添加一條建議，以便我們在seoTag指令中沒有隔離範圍？在鏈接函數中添加'var tag = scope。$ eval（attrs.seoTag）;'並從該標籤訪問屬性和內容。然後，將'tag'傳遞給另一個屬性，將它傳遞給'seo-tag =「tag」'屬性，你的想法是什麼？ –

這就是爲什麼我寫了「這個代碼不完美，但我認爲這是一個很好的基礎。」：D – scareddragon

在重複循環或後循環期間更改屬性？

回答

相關問題