如何使用無效字符訪問對象屬性

我正在編寫一個Angular應用程序，該應用程序與已在使用的Google AnalyticsAPI接口。 Google返回的數據前綴爲「ga：」，如示例「ga：newVisits」中所示。如何使用無效字符訪問對象屬性

如果我使用表達式{{total.ga:newVisits}}，Angular無法解析它。任何逃避冒號的嘗試都會導致錯誤或者完全逃脫我的表達。

如何將{{total.ga:newVisits}}傳遞給Angular，以便表達式能正常工作？

<!doctype html> 
    <html ng-app="AnalyticsApp"> 
    <head> 
     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.7/angular.min.js"></script> 
     <script src="angular-controller.js"></script> 
    </head> 
    <body ng-controller="AnalyticsCtrl"> 
     <ul> 
     <li ng-repeat="total in result"> 
      {{total.ga:newVisits}} 
     </li> 
     </ul> 
    </body> 
    </html>

來源

2014-01-10 VSack

'{{總[ 'GA：newVisits']}}' – dave

在JavaScript中，對象的屬性可通過點符號或括號標記來訪問。點符號通常更清晰，但有限制。正如您已經注意到的，您的屬性包含無效字符，因此無法通過點符號訪問。那麼，解決方案是使用如下括號表示來訪問屬性：total['ga:newVisits']，以便您的完整代碼將爲{{total['ga:newVisits']}}。 Live demo here (click).

約括號標記另一個優點是，它可以讓你使用一個變量名作爲一個屬性：

var myObj { 
    bar: '123' 
}; 
var foo = 'bar'; 

console.log(myObj[foo]); //logs '123'

來源

2014-01-10 23:11:41 m59

我刪除我之前的評論。你100％正確。謝謝你不僅回答，而且詳細的解釋！ – VSack

@VSack好吧，很高興它解決了！我做了這件事以防萬一：http://jsbin.com/OPOyeXOS/2/edit堆棧溢出更多的是學習，而不僅僅是修復錯誤，所以我總是試圖讓我的答案成爲一個教學機會。感謝您的讚賞！ – m59

您需要訪問它，好像它是一個關聯數組：

{{total['ga:newVisits']}}

來源

2014-01-10 23:07:05 dave

如何使用無效字符訪問對象屬性

回答

相關問題