Ng-重複沒有將某些屬性不帶引號傳遞給範圍

我試圖從MongoDB查詢返回的屬性傳遞給Angular中的指令，但由於某種原因，它不會傳遞「_id」屬性。當我查看父級的$ scope中返回的記錄時，我可以看到每個對象實際上都有一個「_id」。但是，當我去檢查我試圖呈現的指令的$範圍時，我可以看到它具有除「_id」之外的所有屬性。Ng-重複沒有將某些屬性不帶引號傳遞給範圍

我父模板代碼：

<div id=cards> 
    <div ng-repeat='card in cards' class='card'> 
     <card-directive 
      _id={{card._id}} attack={{card.attack}} cost={{card.cost}} 
      health={{card.health}} img={{card.img}} name={{card.name}} 
      hero={{hero}} rarity={{card.rarity}} type={{card.type}} 
      class={{hero}} add={{add}} faction={{card.faction}} > 
     </card-directive> 
    </div> 
</div>

我的指令代碼：

function cardDirective() { 
    return { 
     restrict: 'E', 
     scope: { 
      '_id': '@', 
      'img': '@', 
      'attack': '@', 
      'cost': '@', 
      'health': '@', 
      'name': '@', 
      'rarity': '@', 
      'type': '@', 
      'hero': '@', 
      'add': '@', 
      'faction': '@' 
     },

有什麼特別之處包括以下劃線開頭的屬性？

來源

2017-08-30 Ben Melito

你不使用它，就像這樣：'_id = {{card._id}}'，你用這樣的：'_id =「{{card._id}} 「'。此外，對於以下劃線開頭的屬性名稱，請檢查此https://stackoverflow.com/a/79022/4488121 –

AngularJS指令將具有下劃線的屬性標準化爲camelCase。有關更多信息，請參閱[AngularJS開發人員指南 - 指令規範化]（https://docs.angularjs.org/guide/directive#normalization）。 – georgeawg

它應該有工作，只用包裹"（引號）您的屬性值

而不是通過內部屬性的每個值，可以考慮通過整卡對象指令。

<div id=cards> 
    <div ng-repeat='card in cards' class='card'> 
     <card-directive my-card="card"></card-directive> 
    </div> 
</div>

指令

function cardDirective() { 
    return { 
     restrict: 'E', 
     scope: { 
      'myCard': '<' 
     },

所以內部指令，你可以內部card對象輕鬆訪問值和<確保一種方式結合。您可以使用{{myCard._id}}來使用_id。

來源

2017-08-30 20:15:23

由於某些原因，它仍然不適用於引號，但我喜歡傳遞對象的想法。我需要做什麼特殊的事情來作爲對象而不是字符串來訪問它？ –

@BenMelito不，''（單向綁定）會自動將對象傳遞給指令。你可以很容易地從物體中獲取道具。 –

你也可以發佈指令模板的標記嗎？也許這裏有問題。 –

AngularJS正在規範_id至Id的屬性，其中大寫字母爲I。

欲瞭解更多信息，請參閱AngularJS Developer Guide - Directive Normalization。

angular.module("app",[]) 
 
.directive("customDirective", function() { 
 
    return { 
 
    template: `Id={{Id}}`, 
 
    link: function(scope, elem, attrs) { 
 
     scope.Id = attrs.Id; 
 
     console.log("Id=",attrs.Id); 
 
    } 
 
    } 
 
})

<script src="//unpkg.com/angular/angular.js"></script> 
 
    <body ng-app="app"> 
 
    <div custom-directive _id=99></div> 
 
    </body>

來源

2017-08-31 11:32:13 georgeawg

Ng-重複沒有將某些屬性不帶引號傳遞給範圍

回答

相關問題