AngularJS randomly show data bug - angularjs

Here is my running code in Plunker
First issue I want to solve is: I want to randomly show the data. For my case, I have two questions. One is "Do you like Foo", another one is "Do you like Bar".
When I reload the page, I want these questions to show up randomly. For example, maybe "Do you like Foo" show first this time. But when I reload the page, "Do you like Bar" show first.
I made a custom random filter as below, but this will cause bug that "I cannot see the check symbol when I check the checkBox"
$scope.random = function () {
return 0.5 - Math.random();
}
Another in my line 14 of my Plunker, I added <div ng-repeat="item in questions | orderBy: random">
Updated: Based on comment, I created another post for my another.

Instead of picking up questions randomly, you can try shuffling your array before showing any question on your page.
This way, the array's elements will be randomly indexed, and you won't need to run the random function for each question.
Here is a post to help you with shuffling the array using JavaScript. Alternatively, you can also use Lodash's Shuffle function.

Related

show some specific items from a list with map

I want to understand how to display certain items of a list with the Map() function of react.
To illustrate my situation I have created a codesandbox with my problems:
https://codesandbox.io/s/test-uz-713xy
In this example I want to display the number of "gun" that each character has.
But without changing the code too much if possible because my real code is more complex than this example.
I don't want show all objects they have, only the quantity of gun(s)
thanks

Angularjs ng-repeat with datepicker filter executing many times

I finally managed to make my date filters work but now I have a problem...
I have a simple table that is supposed to be filtered by name and date. It is filtering correctly but the date filter is extremely slow. After debugging and researching I know the problem is that my custom dates range (from - to) filter is called many times.
It is called:
When I click on the calendar to choose a date but before actually showing the calendar control
Right after showing the calendar
After selecting a date
It even runs the first 2 times if I don't chose any date after opening the calendar. It also runs every time I change from one month to another.
Also, for each of those 3 times the filter is called, it also runs once for each row I have in the list. In the example I have only 10 rows (it is actually fast) but in my application it has maaany more and it takes a long time.
The ideal is that this code gets called only once after selecting a date.
For simplicity I'm showing here a few lines of my code, but you can see the whole example on this Plunker :
HTML Code:
<!-- This is the datepicker control filter -->
<ng-datepicker ng-model="DateRegisteredFrom" view-format="MM/DD/YYYY" placeholder="mm/dd/yyyy"></ng-datepicker>
<!-- Here is the table -->
<tr ng-repeat="item in model.People | filter:searchText | dateRegisteredFilter:DateRegisteredFrom:DateRegisteredTo | orderBy:orderByField:reverseSort ">
</tr>
And this is my javascript code:
.filter("dateRegisteredFilter", function($filter, $rootScope) {
return function(items, from, to) {
return $filter('filter')(items, "DateRegistered", function(v) {
// Filter code...
});
};
});
After a lot of reading and researching I learned 2 things:
My code gets called this many times due to "dirty checking" done by angular (I read it thanks to this answer: ng-repeat execute many times )
The actual comparision of dates is slow (this would be ok if the code was executed only once but not many)
I would appreciate a lot if somebody could point me on the right direction or if I'm doing something wrong as I've been reading and I only find the reason why this happens but I can't find a solution or a suggestion.
I think you need to change how you are handling your ng-repeat. As you are aware, these filters is constantly running, and because of that it is causing things to run slowly. What you should do is transform the data in model.People separately in your controller instead of piping it through multiple filters. Doing it that way, you can better control when and where the filtering gets done.
This link has a cool gif that helps to show why things are so slow as well https://medium.com/#lightingbeetle/some-best-practices-when-building-a-large-angular-application-c346734a4e9c

Remove selected object in NSTableView from array

I have an array which contains some objects which are displayed in a NSTableView. I want to delete one of them within my control segment UI (- button).
My table is named deviceTable so I need to find out which row is selected.
deviceTable.selectedRow
I think I need some more code on this to get the selected row? Unsure with that... Now I need to find this object within the array (it's called devices) and delete the object. In Swift 3, that should be
ViewController.devices.remove
I need to give some information on this, because RemoveAtIndex has been replaced with remove. I don't know what to do there - any information on this?
Sorry for asking these questions that might be easy for your expertise guys, it's a problem for me here and I hope someone can help me out.
Well, I definelty need some more sleep ._.
ViewController.devices.remove(at: deviceTable.selectedRow)
reloadData()

How can I make nested dom-repeat have independent loop variables?

I need to bind two nested dom-repeats. Something like:
foreach product in some_query
list all product images
So i setup a first dom-repeat which does the product query and inside I launch another query to get the images and another dom-repeat will list them. The result is that all the products listed end up with the same images.
The product names list correctly and all the queries launch correctly also but, in the end, all the image blocks are identical.
I tried with Polymer.templatize and stamp the inner template and also using some elements like iron-list but the result is always the same.
I created a "small" example here
https://jsbin.com/didijo/edit?html,js,output
How can I achieve this?
Let me know if you need any additional information.
Thanks for any help.
I revisited this issue now as I couldn't wait any longer. I got it working by creating a new web component and putting the ajax call and the output inside the component. Something like this:
<template is="dom-bind">
<get-indexes indexes="{{indexes}}"></get-indexes>
<template is="dom-repeat" items='[[indexes]]' as="firstlevel">
<strong>[[firstlevel]]</strong><br>
<get-rowdetails idx="[[firstlevel]]"></get-rowdetails>
</template>
</template>
Look for me if you need help or more details.

How to pass var from controller into a different view with Cakephp

I am new to Cakephp and indeed OOP, so forgive me if i haven't fully grasped the MVC concept yet. I have search a lot but cannot find an answer - perhaps my way of working below is not correct. I hope you can help.
I am building a site which will have many elements relating to their tables and data. I intend to use a view to pick and choose the relevant elements and any parameters needed.
For example, the homepage of my site will have two elements - a latestusers element and a latestscores element. I am trying to use a view not related to either the users or scores models/controllers, stored in 'other/index.ctp'.
I have tried using set() to pass a variable from the users controller (latestusers action) into the other/index.ctp view, but the viewVars remain empty. Could this be due to scope of the variable (i think it is fine for a view in the users folder, i.e. a view specific to the users controller).
I could achieve what i want to do by using global variables, but i think this is missing the point of MVC/OOP. Would be grateful for any suggestions.
I can include code if need be - it is fairly basic at this stage - but i feel my problem lies with how i am going about things, not the code itself.
Cheers,
James
Yes, the issue is with the scope. If you're going to use variables in the element you'll need to pass them in from your view. So the flow would look something like this
Controller $this->set()s the variable into your current view/layout
Your view/layout calls $this->element with the current element path.
Your element uses those variables.
In number 2 you need to pass your variables as an array of data. This section on the cookbook gives more information : http://book.cakephp.org/view/1081/Elements
<?php echo$this->element('helpbox',
array("helptext" => "Oh, this text is very helpful."));?>
Note - I didn't understand part of the question. Just want to make sure you are passing data to the correct view. You should not be calling the view of another controller in your active controller.
Your other/index.ctp should be an element and that element should be called from your layout.

Resources