So I have this code to access data from JSON file.
taskAppControllers.controller('MainMenuCtrl', ['$scope','$http',
function($scope, $http){
$http.get('data/main-menu.json').success(function(data){
$scope.mainMenuOptions = data
});
}]);
Everything is fine. But when I change JSON files, everything stays as it was. If I rename JSON file and access it, it will show updated data, and if afterwards, I rename it back, it will display the output from JSON before it was edited. It probably saves data in browser memory or something similar. It's cache related issue. How do I fix/reset it?
Sound like caching issue, try appending random parameter to the URL, to force fetching a fresh copy from the server:
$http.get('data/main-menu.json?' + Math.random())
I don't believe that this is actually an angular-specific issue. Your browser would likely cache this.
If main-menu.json should be static, consider just doing ctrl+F5 instead of F5 during your debug sessions. If it needs to be updated, you could either change your caching-related response headers to let the browser know that it should not cache, or you could add a "cache buster" to the request by adding a timestamp as a request parameter. That's not the preferred way to handle it, though.
Assuming i understand you correctly, Angular will not dynamically update in the way you're expecting. It will only update when you reload the page or if you code it to reload the data from the server I.e recall the $http service.
You'll probably want to poll the server to check if the data changes or use something like SignalR to "push" the new data to the browser.
Related
I'm working on project with Vue and laravel. In each and ever components have more than one http requests when page is mounting, it's slowing things down and sometimes returns 500 error. So i thought if the data is loaded and store in Vuex store and return when page load it'll be effective, but if the data inside the database changing while navigate through pages, data will not change re actively in pages. So is there a way to detect that change using javascript listners. Any help ?
You should look into https://laravel.com/docs/5.6/broadcasting Basically once your backend code does the change to the DB you will need to broadcast that change to the front end.
I have two pages included on single page which has new-registration form and listing user form below that. At a time I am showing that two things.
What I want is, once I enter the new entry in database, my listing page should be reloaded. I have used $route.reload for that. On submit button, I am calling one function to save the data in database, and after submitting I am calling $route.reload.
But What is happen like sometimes it is working and sometimes it doesn't.
I am using AngularJS 1.3.
I have tried $window.location.reload(); but it didn't work for me.
Somewhere in blog, I have seen like that reload function is not supported for angular 1.3 or less version, then why is it working sometimes.
Can anyone suggest other things to reload the things at a time only once the new record get insert and can some one suggest like where I am getting wrong while using route.reload?
If I remember correctly,
window.location.reload()
reloads the current page with POST data, while window.location.href=window.location.href does not include the POST data.
window.location.href=window.location.href will not reload the page if there's an anchor (#) in the URL - You must use window.location.reload() in this case.
Also, as noted by #Mic below, window.location.reload() takes an additional argument skip Cache so that with using window.location.reload(true) the browser will skip the cache and reload the page from the server. window.location.reload(false) will do the opposite, and load the page from cache if possible.
$route.reload function is available for angular version 1.3 see docs https://code.angularjs.org/1.3.0/docs/api/ngRoute/service/$route
Are you using two different controllers for that two views?
Actually why you want to reload the page? If you want to reload every time (while inserting,updating,deleting)?
See,
You can just push the $http response object (newly added) to existing array.
or Just call the defaultLoad() function after insert success callback
I'm trying to use angulars $http, with both a cache and an interceptor.
The quick question:
Currently when angular gets the answer from the server, it first caches it, and then it passes it through the interceptor.
Is it possible to force angular to first pass it through the interceptor and only then cache it?
The long issue:
The server responds every call with a format similar to:
{permission: BOOL, data:[...]}
In the interceptor response I check the permission, and if correct I throw it away and pass only the data field to the application level. If it fails I reject and popup an error, etc... (Maybe I should do it in a transformResponse function, but I'll endup facing the same issue).
Then for some API calls I'm requesting a bunch of resources like that:
/resource/ALL
And it obviously caches this request and answer, but what I want to do next is fake caching every resource that I received.
So forthcoming calls to /resource/{some resource id} are already cached, cause I've already received it in the call where I requested ALL.
The problem I'm facing is, when I want to fake cache, on the application level, I lost the "{permission: BOOL" part, cause I've thrown it in the interceptor.
Some notes:
1- Of course I could also fake the permission part, and just hardcode it, but I feel it's not an option since if I later add / modify / remove metadata it's another place I've to look at.
2- An other way would be to don't throw the metadata on the interceptor / transformResponse, but again this is not an option since I don't want to select the 'data' field every time I call $http on the application level.
So I think the best option for me would be to cache after the interceptor, and not before.
Hope I made the issue clear, and any answer is welcome!
I am starting with jqtree and I need to load data from server, without url (I have seen examples of loading ajax data from url, and it's not what I need) and I haven't found anything about that anywhere. Does someone know how can I set a jqtree treeview calling the data from the server? Also, how should I return the json node list?
A server request needs a URL. That's how HTTP works.
An alternative you can try is to put the data directly into the page which initializes the jqtree. The data attribute can directly be given a JS object.
I have created RESTFUL urls that respond with some JSON data when fetched by backbone.
So a url like /lists responds with a json array of user-created lists. My want that if the url is accessed by address bar input like mydomain.com/lists, the json data is displayed in text on browser. I want the server to respond only if the url is accessed from within the application. Can somebody provide me some hints on how to achieve this?
Like #Thilo said, you're not going to be able to do prevent a person with the right tools to see what's coming across the wire, Firebug's console/net tabs already keep track of requests and show the contents of responses.
That being said, what you can do is check whether the HTTP_X_REQUESTED_WITH HTTP header is set to 'XMLHttpRequest', and only return the JSON in this case. Backbone makes an Ajax call so this will always be the case with the Backbone calls (in modern browsers). Again this won't help much except for people who type it into the address bar directly (and do a normal GET request) won't see the JSON.