CODEWITHSUNDEEP
javascriptangularjs
Nics1225
Nics1225

Reputation: 236

TypeError: Cannot set property '' of undefined

For some reason, I can't seem to bring this variable into scope to be manipulated.

Markup:

<label>Description only <input ng-model="filter.Description"></label><br>
<label>Tags only <input ng-model="filter.Tags.Text"></label><br> //This methodology works

<div ng-repeat="t in filteredTags" style="display:inline-block">
    <button class="btn btn-warning" ng-click="FilterByTag(t.Text)">
        {{t.Text}}
    </button>
</div> //But I want these buttons to work for the same thing, and they don't

.....

<tr ng-repeat="b in filteredBookmarks| filter: filter:strict">

JavaScript:

 $scope.FilterByTag = function (tagName) {
        filter.Tags.Text = tagName;
    };

If I change the JS variable to $scope.filter.Tags.Text = tagName; I get an error that reads: TypeError: Cannot set property 'Text' of undefined. Has anybody run into something similar?

Upvotes: 0

Views: 17118

Answers (3)

Mahaveer Jain
Mahaveer Jain

Reputation: 29

Of course it is because the hierarchy you are specifying for setting your tagName is not present. so it find the Tags itself is undefined and you are trying to set the Text value of it which is undefined and you got the error.

Try to specify a default data structure of your object where you want to store the value.

$scope.filter = {
  'Tags': {
      'Text': undefined
  },
  'Description': undefined
}

Upvotes: 0

WebWanderer
WebWanderer

Reputation: 10897

Your function should read:

$scope.FilterByTag = function (tagName) {
    $scope.filter.Tags.Text = tagName;
};

Your filter object is on the $scope

Upvotes: 0

machinehead115
machinehead115

Reputation: 1657

Try initializing your filter object first:

$scope.filter = {
    'Tags': {
        'Text': null
    },
    'Description': null
}

Upvotes: 2

Related Questions