Блог

Прежде всего, я довольно новичок в ionic и angularjs. Теперь я пытаюсь разработать приложение, и у меня возникают проблемы с отображением и поиском данных прямо сейчас.

У меня есть вложенный объект json, и я не могу отобразить его с помощью ng-repeat.

Вот объект json.

 $scope.nestedTestdata = [{
                "leadlist ": [{
                    "submitted_date": "01-01-2160",
                    "submission_value": {
                        "full_name": "Full Name ",
                        "phone": "This is test data.",
                        "source": "I hate you"
                    }
                },
                    {
                        "submitted_date": "01-01-2015",
                        "submission_value": {
                            "full_name": "full name",
                            "phone": "phone.",
                            "source": "I really really hate you"
                        }
                    },
                    {
                        "submitted_date": "01-01-2016",
                        "submission_value": {
                            "full_name": "I am awesome",
                            "phone": "HP phone.",
                            "source": "I hate you"
                        }
                    }]
            }];
  

Вот как я отображаю.

  <div class="lead_row" ng-repeat="data in nestedTestdata.leadlist | filter: model.search" >

            <div class="lead_col">{{data.submitted_date | date : 'dd-MMM-yyyy'}}</div>
            <div class="lead_col">{{data.submission_value.source}}</div>
            <div class="lead_col">{{data.submission_value.full_name}}</div>
            <div class="lead_col">{{data.submission_value.phone}}</div>    
        </div>
  

Когда я меняю его на следующий объект json, он также может отображать и выполнять функцию поиска.

  $scope.testdata = [{
                "submitted_date": "01-01-2160",
                "submission_value": {
                    "full_name": "Search is working",
                    "phone": "This is fucking test data.",
                    "source": "I hate you"
                }
            },
                {
                    "submitted_date": "01-01-2015",
                    "submission_value": {
                        "full_name": "Fucking full name",
                        "phone": "Fucking phone.",
                        "source": "I really really hate you"
                    }
                },
                {
                    "submitted_date": "01-01-2016",
                    "submission_value": {
                        "full_name": "I am awesome",
                        "phone": "Fucking HP phone.",
                        "source": "I hate you"
                    }
                }];
  

Поэтому я думаю, что это не проблема отображения.
Пожалуйста, помогите выяснить, как я могу заставить это работать.

Пожалуйста, проверьте полный код по следующей ссылке. http://play.ionic.io/app/720567016712

Заранее большое вам спасибо.

nestedTestData содержит массив. Внутри массива есть объект.

 ng-repeat="data in nestedTestdata[0].leadlist | filter: model.search"
  

ИТАК, код должен быть следующим:

  <div class="lead_row" ng-repeat="data in nestedTestdata[0].leadlist | filter: model.search" >
                <div class="lead_col">{{data.submitted_date | date : 'dd-MMM-yyyy'}}</div>
                <div class="lead_col">{{data.submission_value.source}}</div>
                <div class="lead_col">{{data.submission_value.full_name}}</div>
                <div class="lead_col">{{data.submission_value.phone}}</div>    
            </div>
  

Итак, у вас есть массив, затем вы определяете другой массив с объектом с ключом ‘leadlist’. Приведенный выше ответ может решить вашу проблему, или вы можете просто удалить массив над вашим ключом, вы можете просто получить к нему доступ в обычном режиме data.nestedTestData

Ниже показано, как вы могли бы его переписать:

 `$scope.nestedTestdata = {
    "leadlist" : [{
        "submitted_date": "01-01-2160",
        "submission_value": {
         "full_name": "Full Name ",
         "phone": "This is test data.",
          "source": "I hate you"  
    }

},
{
    "submitted_date": "01-01-2015",
    "submission_value": {
        "full_name": "full name",
        "phone": "phone.",
        "source": "I really really hate you"
    }
},
{
    "submitted_date": "01-01-2016",
    "submission_value": {
        "full_name": "I am awesome",
        "phone": "HP phone.",
        "source": "I hate you"
    }  
}]  
  

};`

Вы можете использовать вложенный ng-repeat , он также будет работать, если в нем есть несколько объектов $scope.nestedTestdata . Вот рабочая скрипка

     <div ng-controller="MyCtrl">
    <div class="lead_row" ng-repeat="data in nestedTestdata">
        <div ng-repeat="list in data.leadlist">
            <div class="lead_col">{{list.submitted_date | date : 'dd-MMM-yyyy'}}</div>
            <div class="lead_col">{{list.submission_value.source}}</div>
            <div class="lead_col">{{list.submission_value.full_name}}</div>
            <div class="lead_col">{{list.submission_value.phone}}</div>
        </div>
    </div>
</div>
  

пожалуйста, удалите пробел после "leadlist "