简体   繁体   中英

AngularJs get filtered input from ng-repeat to a Javascript variable?

I'm currently working with AngularJs and am filtering an input array with a number of select boxes. On the filtered result, I'm running an ng-repeat to display each element in my now filtered array. Now my question. I want to save the filtered input array as an javascript variable, to later display or print the whole result. I actually only want either the filtered input array saved to a javascript variable or even better, the results of each ng-repeat saved altogether in a variable but updating itself after applying a new filter or a filter again. I'm stuck here. Is there a smooth way to do this. Or do you have a even better idea what would work here? Thank's already. Let's say we have a filter for languages and name:

<select class="form-control"
              ng-options="l.language for l in languages"
              ng-model="languageModel"
              ></select>
<select class="form-control"
              ng-options="n.name for n in names"
              ng-model="nameModel"
              ></select>


<ul ng-repeat="sq in input| filter:languageModel| filter:nameModel>

<li>Language: {{sq['Language']}}</li>
<li>Name: {{sq['Name']}}</li>
</ul>

Now I want something like :

$scope.var = ... // The filtered result.

You can directly store the array in your ng-repeat

<ul ng-repeat="sq in (filteredInput = (input| filter:languageModel| filter:nameModel))>

Now you can access $scope.filteredInput to get the filtered array

You can call the filter directly from javascript:

$scope.filteredInput = $filter('languageModel')($scope.input);

Where languageModel is the name of your filter. Make sure to inject $filter in your controller.

By the way, it is weird to have the ng-repeat on the <ul> element. Something more appropriate would be to put it on the <li> :

<ul>
    <li ng-repeat="sq in input| filter:languageModel| filter:nameModel>
        <span>Language: {{sq['Language']}}</span>
        <span>Name: {{sq['Name']}}</span>
    <li>
</ul>

You can write your own filter function in your code behind, something like this

$scope.filterlanguage=function(item){

//add your condition if satisfies return or null
if(condition)
{
return item;
}
return null;


}

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM