停止Angular将[object object]插入到我的文本输入中

Stop Angular inserting [object Object] into my text input

本文关键字:object 我的 文本 输入 Angular 停止 插入      更新时间:2023-09-26

我使用Angular来过滤表的数据数组。过滤器在表上工作,但当我选择其中一个选择选项时,它会将[object object]插入到我的文本输入中。我该如何阻止这种情况?

<div class='table-filters'>
  <div class='row'>
    <label>Search</label>
    <input ng-model="query"   name='search' >
  </div>
  <div class='row'>
    <label for='category'>Category</label>
    <select ng-model="query.cat">
      <option value="">Any</option>
      <option value="VOWEL">Vowels</option>
      <option value="CONSONANT">Consonants</option>
      <option value="NUMBER">Digits</option>
      <option value="SIGN: DEP">Dependent Signs</option>
      <option value="SIGN: IND">Independent Signs</option>
    </select>
  </div>
  <div class='row'>
    <label for='matched-rows'>Matched Characters</label>
    <span id='matched-rows'>{{(rows|filter:query).length}}</span<
  </div>
</div>

我似乎找到了这个plunker的解决方案http://plnkr.co/edit/XklvXtc1AZpndjLvXrh8?p=preview;

<div class='row'>
 <label>Search</label>
 <input ng-model="query[queryBy]"   name='search' >
</div>

js文件:

demo.controller('demoController', function($scope){
    $scope.rows = getRows();
    $scope.query = {};
    $scope.queryBy = '$';
});

我知道,我应该把我的js文件放在问题中。为写得不好的问题道歉。非常感谢。

查询为Object,其toString()实现返回[Object Object]。

使用query.cat作为输入的ng模型。

<input ng-model="query.cat"   name='search' >