I've created a local JSON file and am able to get data from the file using
app.controller('appCtrl', function($scope, $http){
$http.get('employees.json').success(function(data){
$scope.employees=angular.fromJson(data.employees);
console.log($scope.employees);
}); //this is where the data from the json file is taken and stored into $scope.employees. works fine
}
I've been trying to write an equivalent http POST call by doing a $scope.employees.push, but it is only (understandably) updating the value of the local variable.
How do I update or add values to the original employees.json file?
I don't think it's possible to do that directly from Angular. There are some other sources that you integrate into your app, which you can then have Angular leverage.
Exploring the FileSystem API (HTML5) - verify which browsers
support this.
Another options is jQuery.twFile.
You could also just store it as localstorage and access it as you would just about any other object. This would be the method that I'd lean towards more (depending on the size). Otherwise I've always had to have the server-side do it.
Related
I need to get a json file which is on my local machine, but my baseUrl in Restangular is not localhost...
So, here is the question:
Is it possible to get local file with Restangular.service when a base url is not localhost ?
And how can I do that?
See this post : Local file access with javascript
It is not a problem with Restangular but with Javascript.
If you need it for test purpose you can try to find a way to do it (see the post)
If you are doing this in production, it is a bad practice. You should not access local machine from front-end
Rather than using Restangular for this instance, I would just use a simple $http.get() operation.
How can a Javascript variable set on a server(via properties file) be injected to an Angular js/JavaScript app?
There is a Java Jersey application that has client files (js, HTML, CSS, etc.) under the /src/main/webapp folder and there is a javascript variable that I would want to set before it gets served to the client. For example , please consider the following:
<script type="text/javascript">
var serverHost = "<%serverHost%>";
</script>
How can I replace the value of "<%serverHost%>" String with a value of my choice that will be evaluated at runtime? Preferably via properties.
The goal of this is that the client has Rest calls and the URL cannot be relative and has to be full because the application will be accessed via a different/middle man server, so ultimately the rest calls need to reach the originated host server. The value is need via a properties file so the application/same build can work on different environments.
Would appreciate any ideas.
Thank you
The problem you are trying to solve needs server side rendering.
In your case, for example,
You can retrieve the host URL from the properties file on the server side, pass it to the view using the controller, and in the view, using JSP tags, generate an HTML for which the serverHost variable is dynamically set
HOWEVER....
As you are using AngularJS, this type of rendering is clearly against Angular's philosophy.
You can create a constant in angular,
angular.module('myApp').constant('SERVER_URL', 'http://localhost:8000/');
You can set the value of this constant during the build.
OR
You can create a simple API where you'll retrieve the host url value from the properties file, preferably in JSON format, then you can simply call that API to set this constant value.
I have a data-binding to $rootScope.someArray in my someData.view.html. I have written a Data service to load data and populate $rootScope.someArray and have called that service in my App's "run" method. Now If I am on the someData.view.html page and hit refresh(F5) all the data vanishes. Although if I go to home again and navigate to this html page, every thing comes back.
When I put a debug point on the place in DataService code where $rootScope.someArray is being populated, I can see data getting fetched from the backend but somehow it's lost.
Basically angular won't have the data on refresh. If you want retain you data, you need to use,
session service or local storage service based on your need (Don't forget to clear on log out).
But Putting all the data in local storage services or putting sensitive data in the local storage services is not advisable. So you need to call the Back end method and assign the data to the variable in the controller init (call using ng-init).
Note : Don't dump your array of data in RootScope. AngularJs team
itself suggesting that not to use. Instead of this use Angular
Services (not Factory) and make use this services where ever you want.
I'm writing an application which uses AngularJS 1.4.0 which requires the ability to receive POST data from an external application. I know that routes in AngularJS often do parameters in the URL such as this:
.when('/section/:param', {
templateUrl: 'views/home.html',
controller: 'AppCtrl'
})
The problem with this style is that in my case the parameter is often very very long and it will cause the web server to ignore / truncate the request / parameter because the URL exceeds the maximum URL length.
For this reason, instead of a standard GET style parameter, I would like the application to receive a POST parameter, but I am not sure how to capture the parameter(s) and value(s).
Is there a way for Angular to capture the POST parameters directly? My second option would be to simply have an ng-init which uses a backend to grab the values, but I'd prefer to keep the parameters solely in Angular if possible. Thanks!
Except if your willing to do some weird black magic by setting cookies server-side - or something similar - there is no way to this in javascript.
POST values are sent to the server upon request, it's impossible capture these with javascript running in your browser.
Check out this answer aswell: How to read the post request parameters using javascript
I have an MVC.NET app which using Knockout.js (+ knockout.mapping) to deal with some cascading dropdowns. The data for these comes from a WebAPI call to an external service. As it happens this service requires an authentication token which expires after 2 hours, so I have the MVC app put the data from the service in a System.Web.Caching.Cache and return it from there unless the token has expired where it will grab it again from the service.
This is working fine.
However when I need to get this to the View, I am currently using the following method, which is to have a property of the ViewModel that I assign the service/Cache data to and then do this in the view:
var model = new ViewModel(#Html.Raw(Json.Encode(Model.ReferenceData)))
ko.applyBindings(model);
where Model.ReferenceData is the data from the service.
again this is working fine, but... the thing is with this, that the page then has all that Json data dumped in it on each request.
I would like to use an external JS file for the ReferenceData as then at least it can be cached by the browser and lessen the weight of the page on future requests.
However, I imagine that the overhead of generating a JS file is not that small, along with – what I really need is it to generate a link to that file that changes in much the same way that the built in MVC bundling of js files works – generating a link with a querystring.
My question is: is there an easy way of doing this?
For sure I can, when the cache is filled that first time, generate a js file and reference that from the View, but as I say getting that to change its link each time it is refreshed – or at least working out whether the data in it has changed and updating it only then is where the problem lies.
Any insight to this would be of great help
Thanks
Nat
Version the JS file (you can keep a GUID in the file it-self).
In Application_Start() get this version ID to a static variable.
In your controller pass this static variable data to ViewBag.
Ref your script with this ID
When you regenerate the file, update the version in file as well as your static variable. Next request from the client get the new version with new key.
Now if you want to update clients on the new version you have to use bi-directional protocol like web sockets or long-polling.