如何避免“从JSON数据创建$范围属性时无法获取未定义或空引用的属性'X'

Question

我想从使用$http.get拉下来的某些JSON数据填充某些图表数据。但是，我遇到的问题是我绑定的$scope属性在返回JSON之前不存在，所以页面在加载时会引发错误。

如何避免该错误？感觉就像我有鸡和鸡蛋的情景。

例子：

$scope.Model.Charts.Electricity = { 
    series: [ 
    name: "2014 Target", 
    data: $scope.Model.Data.Json.Charts.Electricity.CurrentYearTarget 
    ] 
}; 

的Electricity.CurrentYearTarget属性是一个不存在的，直到承诺完成：

promise.then(
    function(payload) { 
    $scope.Model.Data.Json.Charts = payload.data; 
}); 

的JSON是什么，然后定义了.Charts下坐的对象。例如：

{"Electricity": 
    {"CurrentYearTarget": 
    [10000.0, 
     // snip 
    10000.0] 
    } 
} 

好的，那么我能做些什么来处理这个问题？我想我可以将我所有的属性（如$scope.Model.Charts.Electricity等）包装成一个简单的JavaScript if声明，但这并不合适。

Answer 1

我建议你考虑有所简化你的方法，如$scope.Model.Data.Json.Charts.Electricity.CurrentYearTarget是有点冗长，Model，Data，Json都意味着同样的事情真的，你也许可以减少一些这些了。

然而，这是毫无意义的，你仍然可以acheive你想，只是填充数据什么时候请求有返回：

$scope.Model = { Data: { Json: { Charts: {} } } } 

promise.then(
    function(payload) { 

    $scope.Model.Data.Json.Charts = payload.data; 
    $scope.Model.Charts.Electricity = { 
     series: { 
     name: "2014 Target", 
     data: $scope.Model.Data.Json.Charts.Electricity.CurrentYearTarget 
     } 
    }; 
});