AngularJS, как получить и установить фильтр, определенный в ng-repeat из контроллера? - PullRequest
Новая
       27

AngularJS, как получить и установить фильтр, определенный в ng-repeat из контроллера?

0 голосов
/ 06 ноября 2019

Простой блок HTML, представленный ниже, просматривает список объектов-людей в формате JSON для отображения их имен и фамилий. Два поля ввода над ng-repeat связаны с фильтрами на основе firstName и lastName соответственно. Пока все хорошо, работает.

Моя цель - захватить пользовательский ввод в полях фильтров в контроллере, когда они покидают страницу, а затем повторно заполнить фильтры, когда они вернутся на страницу. Я могу захватить / получить значения полей поиска с помощью $ scope. $ On ("$ destroy" ... когда страница оставлена. Однако, когда я пытаюсь установить эти поля, $ scope.search.firstName = 'Джон 'Я получаю сообщение об ошибке: $ scope.search не определен. Моя цель - использовать файлы cookie для сохранения, а затем сброса значений полей фильтра, но я не уверен, почему набор не работает и как его исправить. 

<table>
    <tr>
        <td><input type="text" ng-model="search.firstName" /></td>
        <td><input type="text" ng-model="search.lastName" /></td>

    </tr>
    <tr ng-repeat="person in personList | filter:search:strict">
        <td>
            <span class="col-xs-offset-2">
                {{person.firstName}}
            </span>
        </td>


        <td>
            <span class="col-xs-offset-2">
                {{person.lastName}}
            </span>
        </td>

    </tr>
</table>

// фрагменты от контроллера 

$scope.search.firstName = 'John'; // this does not work, returns error

$scope.$on("$destroy", function () {
    console.log($scope.search.firstName); // this works
    console.log($scope.search.lastName)); // this works
});

Ответы [ 2 ]

0 голосов
/ 08 ноября 2019

в фильтре у вас должен быть тот же тип объекта, в противном случае вы должны отобразить его по свойству по свойству

попробуйте таким образом, по вашему мнению 

<table>
    <tr>
        <td><input type="text" ng-model="search.firstName" /></td>
        <td><input type="text" ng-model="search.lastName" /></td>

    </tr>
    <tr ng-repeat="person in personList | filter:{firstName: search.firstName, lastName: search.lastName}">
        <td>
            <span class="col-xs-offset-2">
                {{person.firstName}}
            </span>
        </td>


        <td>
            <span class="col-xs-offset-2">
                {{person.lastName}}
            </span>
        </td>

    </tr>
</table>

перед использованием поисковой переменной в вашем представлении инициализируйте ее в вашем контроллере как 

$scope.search = {firstName: '', lastName:''};
0 голосов
/ 07 ноября 2019

Если вы получаете это TypeError: $scope.search is undefined, вы должны попытаться установить эти значения, сначала определив search как объект. 

$scope.search = { 'firstName': '', 'lastName': ''};
$scope.search.firstName = 'John';
...