2015-06-04 76 views
0

我有一個對象數組($scope.fields),它定義瞭如何爲$scope.data對象模型設置輸入字段。 fieldName屬性實際上是該字段的data對象中的路徑。嵌套對象由句號分隔。動態引用一個嵌套的Javascript對象

如:

$scope.data = { 
     user: { 
     } 
    } 
    $scope.fields = [ 
     {fieldName:'user.firstName',fieldLabel:'First Name',dsiabled:false} 
     {fieldName:'user.location.lat',fieldLabel:'Latitude',dsiabled:false} 
     {fieldName:'user.location.long',fieldLabel:'Latitude',dsiabled:false} 
    ] 

什麼是在HTML結合基礎上的字段名的$ scope.data領域的最佳途徑。我知道JavaScript的eval - 但這是做到這一點的最佳方式?爲什麼這個語法不適合我?

即:

<div ng-repeat="fieldObj in fields"> 
    <dd ng-bind="eval('data.' fieldObj.fieldName)"></dd> 
</div> 
+1

參見[訪問嵌套JavaScript和串鍵對象( http://stackoverflow.com/q/6491463/218196)...但我不知道如何可以與Angular集成。 *「爲什麼這個語法不適合我」*推測你不能在'ng-bind'中放入任意表達式。 –

+0

所以技術上我可以ng綁定到一個函數,將返回正確的綁定 - 感謝您的幫助菲利克斯國王。我現在要測試它。 – Andy59469

回答

0

感謝@Felix克林我計算出如何做到這一點。

我使用了來自Felix_kings ref的字符串想法的對象,並將回調函數應用於接收完整對象引用的ng-bind。

0

最近我開發了一個Object方法來完成這項工作。這種單線程遞歸方法動態地訪問數組對象結構中的任何值,而不管它的嵌套深度如何。按照您的例子

var fields = [ 
 
    {fieldName:'user.firstName',fieldLabel:'First Name',dsiabled:false}, 
 
    {fieldName:'user.location.lat',fieldLabel:'Latitude',dsiabled:false}, 
 
    {fieldName:'user.location.long',fieldLabel:'Latitude',dsiabled:false} 
 
]; 
 

 
Object.prototype.getNestedValue = function(...a) { 
 
    return a.length > 1 ? (this[a[0]] !== void 0 && this[a[0]].getNestedValue(...a.slice(1))) : this[a[0]]; 
 
}; 
 

 
document.write(fields.getNestedValue(0,"fieldName"));

對於moredeeply構造體,你總是可以做到像

Object.prototype.getNestedValue = function(...a) { 
 
    return a.length > 1 ? (this[a[0]] !== void 0 && this[a[0]].getNestedValue(...a.slice(1))) : this[a[0]]; 
 
}; 
 

 
var arr = [{fox: [{turn:[857, 432]}]}, {sax: [{pana:[777, 987]}]}, {ton: [{joni:[123, 567]}]}, {piu: [{burn:[666, 37]}]}, {sia: [{foxy:[404, 696]}]}], 
 
    myObj = { foo : 1, bar: { baz : 2 }, bee : 3 }; 
 

 
document.write(arr.getNestedValue(3,"piu",0,"burn",1));