I'm trying to get data from an array dynamically without having to right every object like this:
<option value="City" selected="selected">City</option>
<option data-option="USA" value="LA">{{countries.data[0].cities[0].name}}</option>
<option data-option="USA" value="CA">{{countries.data[0].cities[1].name}}</option>
unfortunately, i cannot post the source code here because it belongs to my company but i can describe my issue
I need to not to have to write every city in a new option element, i need the elements to be generated dynamically as long as there are still index in the array, i tried to use ngfor but i dont know the right syntax for it to generate every index in an element.
I can describe further if anything is missing or not clear, just comment.
Related
PizzaBuilder1.js
Ingredients.js
Bases.js
PizzaBuilder2.js
PizzaBuilder3.js
I'll try to describe my issue in the least confusing way. So what I'm trying to achieve is create a function(pic4-PizzaBuilder2), where I compare the given key of this.state.ingredients.Bases (and other sub-objects, but that's not important for now) with value of selected option tag in Bases.js and when it matches, set the given value of that key to true. The hierarchy is like this: PizzaBuilder.js > Ingredients.js > Bases.js. I have already managed to match each option value with the key inside the object with the same name. However, what I'm still struggling with is how to access it in PizzaBuilder.js when the select option value I wanna compare it to is 2 trees down (see pic4-PizzaBuilder2, that is supposed to be const selectedOption, but I obviously still need to figure out how to access it). I'll be really grateful for any kind of advice.
I am a beginner.
trying to make a simple soccer game.
All values are initialized to 0.
select 2 different teams from the dropdown >> enter final score (cannot be negative).
On clicking 'Final score' button,
function should increment the value of 'Played' to 1 for both the teams.
as well as display in the table.
function updateTeam(winner,looser){
if (var a = $scope.Ligateams.lastIndexOf(winner)){
$scope.Ligateams.played = "1";
}
}
Code here
I took a look here, found a few things. I did not change everything, but you should have the tools to make other changes (ex. updating the draw count).
You had two controllers, one was basically acting just to retrieve the list of teams. This complicated the manipulation of the data, so I changed to use $http, and loaded from a .json file.
In your UI, you iterated over the teams, and stored the name. I changed this to store the index for the two teams that were selected. This is used throughout the code to access that team. Since iteration was already occurring in the UI, it made sense to store those indices vs. searching it again in the controller. This grants us access to the object in the teams array with which to increment values.
Relevant bits of code follow.
Load Data via HTTP
$http.get('teams.json').then(function(resp){
$scope.Ligateams = resp.data;
})
Using the index vs. Name
<select ng-model="Matchteam2.idx" ng-disabled="editButton1">
<option ng-repeat="Matchteam2 in Ligateams"
value={{$index}}>{{Matchteam2.name}}
</option>
</select>
Accessing Team info in the Controller
Now we can get the team object from the array of teams with the index.
var team1 = $scope.Ligateams[$scope.Matchteam1.idx];
var team2 = $scope.Ligateams[$scope.Matchteam2.idx];
team1.played++;
team2.played++;
Accessing Team info in the UI
Since the basic 'name' field is no longer on Matchteam#, we can access the name property on the team object in the Ligateams array, again using the index.
Goal by Team <b>{{Ligateams[Matchteam1.idx].name}}</b
Here's a sample with some things fixed: https://plnkr.co/edit/Yby8D0z8IIEGXNxlwX4D?p=preview.
I'm working on an application where I have to handle vehicules (items) defined by their brand, model and phase. Here is a simple version on Plunker : http://plnkr.co/edit/gA9mzMde4i9hpDfeOdWe
I have created 3 select based on a list of brand. Each brand has a list of models, and each models has a list of phases.
<select ng-options="brand as brand.label for brand in list track by brand.id" ng-model="itemTemp.brand" ng-change="itemTemp.model=''; itemTemp.phase='';">
<option value="">Choose a brand</option>
</select>
When I saved the informations in my database, I realized that I was saving the whole models array in my item.brand and the whole phases array in my item.model, which in reality is way bigger than the example on Plunker. In order to save lighter item in my database, I decided to save only the labels of my brand and model. I reduced the weight of my item by 10.
The problem of doing so is that later when I need to retrieve the informations of the item I saved in my selects, I can't. If I save the whole arrays in item.brand ans item.models, my selects can retrieve the informations and take the correct value.
My question is : Is there any way to have the same result by only saving the labels and not the whole arrays ?
You can retrieve saved data by comparing it with your source array.
Unfortunately it requires looping over data and find the matching entry.
I have edited your Plunker: http://plnkr.co/edit/dC1hMD2ZL79z37kPHAzE?p=preview
$scope.restoreItem = () => {
$scope.itemTemp.brand = findInArray($scope.list, $scope.itemSaved.brand, 'label');
$scope.itemTemp.model = findInArray($scope.itemTemp.brand.models, $scope.itemSaved.model, 'label');
$scope.itemTemp.phase = findInArray($scope.itemTemp.model.phases, $scope.itemSaved.phase);
};
I don't want to use any Javascript code or $scope variable.
Just want to print 1,2,3,4,5 values in Drop Down using ng-options.
This is what I have tried:
<select ng-name="priority" ng-options="priority for priority in Range(1, 5)"></select>
Working solution, within your requirements:
<select ng-model="priority" ng-options="priority for priority in [1,2,3,4,5]"></select>
Just in case, here's the plnkr to experiment with. If you have a quick look at the angular source code, you will see that ng-options requires select element as well as ng-model. Not sure what is the Range implementation mentioned in your example, but here is a very creative thread on this topic. Though, if your array is always the same and you really don't want to use scope (but why?), you're better off with the solution above.
I'm using an analog of Shopify and I'm stuck with syntax of Liquid.
I need to output in the template the field with an id product[product_field_values_attributes][][value]
So I need to write a loop to get the i value of this array.
I'm confused with this empty element in the brackets.
I've looked through the examples of loop syntax in Liquid but all of those arrays are simple and they are not my case.
For example, the Title field has id product[title] and in Liquid template i call this variable product.title and it works fine.
But all my tries to write a loop for this array failed.
Please, help to write a loop to get the values of the array stated above.
Try outputting the array directly onto the page using {{ product }} or {{ product[product_field_values_attributes] }} somewhere in the HTML. That will do a JSON-like string representation of the array. From there you can figure out what the keys for the array are.
I'm not sure what you're saying about the i value. You don't reference i anywhere else in your question. If you can clarify that then we can see if something can be done about it.