AngularJS Error: Cannot set property 'UserData' of null

时间:2016-08-31 12:34:08

标签: javascript angularjs

I run the following AngularJS code from a partial page:

$scope.$parent.UserData = {};
$http.get('http://.../GetUserData/').
then(function (result) {
    $scope.$parent.UserData = result.data;
}, function errorCallback(error) {
    console.log(error);
});

I know that $scope.$parent is not null and I know that result.data returns an object with multiple properties. Not sure why I am getting this error since $scope.$parent is not null

The above partial page is displayed in ui-view on index page. Here is html from index page:

<body ng-controller="BaseCtrl">
    <nav>

    </nav>

    <div class="" ui-view>
    //partial pages displayed here
    </div>


 <!-- Modal Structure -->
 <div id="modal1" class="modal">
    <div class="modal-content">
        <h4>Heading</h4>
        <div class="row">
            <table>
                <tr>
                    <td>ID:</td>
                    <td>{{UserData.ID}}</td>
                </tr>
                <tr>
                    <td>Person name:</td>
                    <td>{{UserData.Name}}</td>
                </tr>
            </table>
        </div>
    </div>
    <div class="modal-footer">
        <button ng-click="closeModal()" class="modal-action modal-close waves-effect waves-green btn-flat">Close</button>
    </div>
</div>

</body>

3 个答案:

答案 0 :(得分:0)

我认为你还没有定义$scope.$parent。所以先定义它。

$scope.$parent = {};
$scope.$parent.UserData = {};
$http.get('http://.../GetUserData/').
then(function (result) {
    $scope.$parent.UserData = result.data;
}, function errorCallback(error) {
    console.log(error);
});

对象对象的最佳语法。

$scope.$parent = {UserData:{}};

答案 1 :(得分:0)

可以试试这个

$http.get('http://.../GetUserData/').
then(function (result) {
    $scope.$parent.UserData = {};
    $scope.$parent.UserData = result.data;
}, function errorCallback(error) {
    console.log(error);
});

答案 2 :(得分:0)

After a while of trying out different things I finally came up with the solution. Here is what worked for me:

$scope.$parent.UserDataColl = [];
$http.get('http://.../GetUserData/').
then(function (result) {
    $scope.UserDataColl.push(result.data); 
}, function errorCallback(error) {
    console.log(error);
});