I have an exemple as this one:
<div id="test" ng-repeat="foo">
I would like to change in my script the ng-repeat to something else (for example foo to foo2) when i do something (clicking on a button for example). Is it possible ?
Thank you a lot for your help !
I would like to change in my script the ng-repeat to something else (for example foo to foo2) when i do something (clicking on a button for example). Is it possible ?
No
AngularJS parses ng-repeat directive value and expects pattern item in collection
But you can replace list through which you iterate.
<div id="test" ng-repeat="item in foo()">
where foo() might be some method that returns array of objects
But is it possible to change the function foo() with foo2() dynamically ?
you can write method foo() as:
$scope.foo = function(){
if($scope.clicked){
return array1;
}
alse{
return array2;
}
}
From Angular_6.6
var expression = $attr.ngRepeat;
var ngRepeatEndComment = $compile.$$createComment('end ngRepeat', expression);
var match = expression.match(/^\s*([\s\S]+?)\s+in\s+([\s\S]+?)(?:\s+as\s+([\s\S]+?))?(?:\s+track\s+by\s+([\s\S]+?))?\s*$/);
if (!match) {
throw ngRepeatMinErr('iexp', 'Expected expression in form of \'_item_ in _collection_[ track by _id_]\' but got \'{0}\'.',
expression);
}
The pattern is:
/^\s*([\s\S]+?)\s+in\s+([\s\S]+?)(?:\s+as\s+([\s\S]+?))?(?:\s+track\s+by\s+([\s\S]+?))?\s*$/
^^^
foo() will return different listng-if to switch between 2 divsYou can repeat into foo and change it without problem when clicking on button. It's working using a third variable between your two arrays that you want to repeat.
<div ng-controller="ctrl">
<div ng-repeat="x in choice">{{x}}</div>
<button ng-click="switch()">Switch</button>
</div>
app.controller('ctrl',function($scope){
$scope.items = [1,2,3,4,5];
$scope.itemsAlternative = [6,7,8,9];
$scope.choice = $scope.items;
$scope.choice = ($scope.choice == $scope.items) ? $scope.itemsAlternative : $scope.items;
}
})
