使用绑定到 ng-model 的 angularjs 搜索特定的 JSON 数据输入数据

Question

我正在使用 Angular 尝试在 JSON 数据中搜索用户输入的特定名称。我将输入的数据传递给 clickButton 函数，使用 angular.forEach 进行迭代并将键/值推送到结果中。示例：在表单中输入 Sam，单击搜索，它会找到所有 Sam JSON 数据。 小提琴a link！

   angular.module('myApp').controller('myController', 
   ['$scope', '$http', function($scope, $http) {
   $scope.stuff = {
   "People": {
    "Sam":[
   {"Name":"Sam", "Address":"Street","Phone":"111", "status":"Available"}], 

    "Tom": [
{"Name":"Tom", "Address":"Road", "Phone":"222", "status":"Busy"}
    ]};
};

$scope.results = [];

$scope.clickButton = function(enteredValue) { 

     $scope.items = $scope.stuff.People;
      $scope.text='You searched for:';

    angular.forEach($scope.items, function(value, key) {
      if (key === enteredValue) {
        $scope.results.push
    ({name: key, address: value[0].Address,     phone: value[0].Phone });
      }
    });

  };

Answer 1

您可以使用过滤器。

ng-repeat="person in people | filter: q"

这里是一个例子：http://jsfiddle.net/rnzeqqd5/

您还可以选择要过滤的属性（假设仅按姓氏搜索）：

ng-repeat="person in people | filter:{ lastname: q }"

http://jsfiddle.net/rnzeqqd5/1/

Answer 2

你犯了很多小错误。开发 Angular 应用程序最简单的方法是从可行的东西开始，然后从那里继续前进。不要把它全部写出来，因为那样很难弄清楚如何纠正它。

我遇到的最大问题是：

• 您的 html 标记应该是有效的
• 只声明一次应用和控制器
• 包括角度（！）
• 告诉 jsfiddle 把 javascript 放在哪里
• 您的 JSON 数据结构比它需要的更复杂

另外，如果要过滤数组，可以使用filter。

<tr ng-repeat="result in people|filter:enteredValue">

我已将您的小提琴更新为工作状态：http://jsfiddle.net/utr0z73c/1/