TypeError：無法設置未定義的屬性“

Question

由於某些原因，我似乎無法將此變量帶入要操作的范圍。

標記：

<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;
    };

如果我將JS變量更改為$scope.filter.Tags.Text = tagName; 我收到一條錯誤消息： TypeError: Cannot set property 'Text' of undefined 。 有人碰過類似的東西嗎？

Answer 1

嘗試先初始化您的過濾器對象：

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

Answer 2

您的函數應為：

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

您的filter對象在$scope

Answer 3

當然，這是因為指定的用於設置tagName的層次結構不存在。 因此它發現標簽本身是未定義的，並且您嘗試設置未定義的標簽的Text值，並且出現了錯誤。

嘗試指定要在其中存儲值的對象的默認數據結構。

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