0

How would one be able to do add an if statement in an ng-init with the expressions of a ng-repeat

<div ng-repeat="game in games">
  <div ng-init="game.Present = (game.In == game.stock ? 1 : 0)"></div>
  <div ng-init="game.Rated = (game.rated == game.userrated ? 1 : 0)"></div>
  <img ng-src="GameCover.jpg" />
  <div ng-show="(game.Present+game.Rated < 2">Promote Game image with flashy cover</div>
</div>

the 1 and 0 are just a swith, it could as well be yes or no. the question here being, how would one be able to use the ng-init with an if-else statement. This is of course a very simplified example. Is it possible to add an if statement in and ng-init and use that one as a scope, if not or not recommended. How would one do this other wise?

Ewald Bos
  • 1,560
  • 1
  • 20
  • 33
  • you could use a function – Groben Aug 08 '18 at 12:18
  • Close your div properly first in your line which is
    – Rashedul.Rubel Aug 08 '18 at 12:52
  • Simple: just read the documentation, which clearly tells you that you should not use ng-init. Initialize the game where it should be initialized: in the controller, where you can use as many if/elses as you want. – JB Nizet Aug 08 '18 at 16:42
  • One should not is not the same as one could not :) but this being said. How would one be able to do this? I made the question a bit more difficult, i added an additional ng-init based on expressions from the ng-repeat and then calculate the total to compare in an ng-if. Basically it could be that the div add an additional flashy banner over the product image. – Ewald Bos Aug 08 '18 at 21:04
  • 1
    In the JS code of the controller, use the exact same loop as the one you're using in the view: you loop through the games, and for each game, you execute the instructions you have in your ng-inits. Mixing lowercase and uppercase properties is a terrible idea, and having a property named rated and another one named Rated is even worse. Note that these additional properties aren't even needed. All you need is `
    `, and the implementation of this `shouldPromote()` function in the scope.
     – JB Nizet Aug 08 '18 at 21:22
  • 1
    http://next.plnkr.co/edit/5GQ8x6GSrx74VX3h?open=lib%2Fscript.js&deferRun=1 – JB Nizet Aug 08 '18 at 21:31
  • thanks JB Nizet, i just made it quickly as an example what i would like to accomplish, it's not actual data :) however. Would you be able to show me what you mean with the loop in the controller so i get the same result as for example: if bigger as 2 then show this div. Do you mean angular.foreach($scope.games etc.... ? because how would i be able to connect it to the right one in the ng-repeat in the view? I see you was way faster as me to type my answer/question – Ewald Bos Aug 08 '18 at 21:31
  • 1
    Try something on your own. Iterating over an array of games and executing two lines of code for each game of the array shouldn't be a problem. angular.forEach, array.forEach, or a simple for loop are all valid options. – JB Nizet Aug 08 '18 at 21:40
  • @JB Nizet, thanks you helped me in the right direction :) perhaps you could add the plnkr as an answer so i would be able to accept it? – Ewald Bos Aug 09 '18 at 08:40

1 Answers1

0

Attributes that contain spaces need to be enclosed in quotes:

<div ng-repeat="game in games">
  ̶<̶d̶i̶v̶ ̶n̶g̶-̶i̶n̶i̶t̶=̶g̶a̶m̶e̶.̶P̶r̶e̶s̶e̶n̶t̶ ̶=̶ ̶(̶g̶a̶m̶e̶.̶I̶n̶ ̶=̶=̶ ̶g̶a̶m̶e̶.̶s̶t̶o̶c̶k̶ ̶?̶ ̶1̶ ̶:̶ ̶0̶)̶>̶<̶/̶d̶i̶v̶>̶ 
  <div ng-init="game.Present = (game.In == game.stock ? 1 : 0)"></div>
  <div ng-show="game.Present == 1">Game Present</div>
</div>

The code can be simplified:

<div ng-repeat="game in games">
  <div ng-show="game.In == game.stock">Game Present</div>
</div>
georgeawg
  • 48,608
  • 13
  • 72
  • 95
  • i know it can be easier, but that's not the question. The question is if it is possible to use an ng-init with an if and use that as a scope variable to do something as to promote an image as example – Ewald Bos Aug 08 '18 at 21:08