So, a little background on this, I have an AngularJS/Ionic project that I'm attempting to do some improvement on, I'm placing all my HTML/JS/CSS into a database table, which in turn will be retrieved on a GET upon app start. HTML is then saved in a factory(also local storage). The goal, is to have an app that can be controlled from the HTML/JS/CSS that is within the Database table, so that we don't need to redeploy new versions for simple updates/fixes. Here's what I have tried:
The most successful method I used was using the below within the controller:
$scope.pageContent = $sce.trustAsHtml(htmlString)
and calling it within the HTML like below:
<div ng-bind-html="pagecontent"></div>
The only problem is, that it isn't compiling correct in a few ways - All my $scope values within the HTML aren't being linked to the parent controller scope.
My questions is: Is there a better way of handling this? I've seen a few people claiming using directives would be the way to go, but can't get a definitive answer on how to implement. Or, is how I'm moving forward working, and I'm just missing some key components... Any help on best way to implement would be greatly appreciated. Let me know if I left any information out, thanks!
Related
I'm trying to build a service worker in React to detect changes in an S3 bucket that's being hosted via Cloudfront, but I can only get the update function to trigger when the page reloads. I guess I don't really understand how the service worker knows to update things. I did disable all cache in Cloudfront to make sure there wasn't a conflict of some sort as well. I've followed countless tutorials and I've basically resorted to even copying and pasting the extremely common code you find on all tutorials, but with the same result. I've also viewed many articles on the lifecycle, but I still just don't understand how it knows there's an update. I'm currently using this example: https://deanhume.com/displaying-a-new-version-available-progressive-web-app/
Any help is appreciated.
I'm not sure if this will help, I've been looking into it for some time. On Angular, there is a json file (ngsw.json) that contains a hash table, this table looks like this:
"hashTable": {
"/index.html": "4f5c690352e4a44a0e4477aecdd8e1a8cc5ff6cf",
"/main.daf1c14bd2840a967b00.js": "3c430c33be512e07a2be37546ba347d6a4ca7f52",
"/polyfills.02f925d581acabc054de.js": "0baf1f319c628f0e0241fe2255b01713da669b06",
"/runtime.423876bdf008fc4fd61e.js": "e34e25e3c24c465898be3ca59ffbcad2ca31e9cf",
"/styles.d30753183b32d43cebfa.css": "a27cde0231bba0947197999242cc83d826f6fa1f"
},
From memory, the files contained within this hash table are the files that are triggering the update. An update is triggered once a hash has changed.
In some preferences files, I kind of remember that I was able to specify which files should trigger an update.
I am sorry I can't be more precise, but hopefully it will help you!
I feel like there is relatively little documentation on the "best practices" of how one should go about organizing AngularJS code. For example, in many of my web pages, i.e.
index.php
profile.php
editprofile.php
There are often many factories and methods that I need repeated. For example, profile.php,, editprofile.php, and index.php all need the factory userDropdown (to get the top navbar dropdown menu). However, some of them need "modified versions of factories". For example:
index.php needs a way to get all the users and their information
profile.php needs a way to get some users information
editProfile.php needs a way to get only one user information
What I mean is that (and the above was a poor example), is that often many .js files needs some modified "child" of a "parent" factory. I find it hard to scale my application because profile.php, index.php, and editProfile.php all refer to their own factories and methods, not a base file. Changes, improvements, errors, found in one factory and is corrected, will not propagate into other files (which I find very frustrating). I also don't want to write /copy/paste services and factories over and over again. Other issue I've had is that:
X.js file need some providers that Y.js file doesn't. However, both needs providers A and B, but X needs C and Y needs D. Is it bad for me to use the same "factory" and providers" for both of them (i.e. inject A, B, C, and D into both of them?) That's the problem I see with having a base factory of a factory to serve a lot of .js files. How much space or inefficiency is it to define providers or injectable services that you don't use?
How do I accomplish some scalable angularJS code to do this, or how do you guys go about organizing your angular code? And also, what about repeating HTML templates (i.e. repeating HTML code that needs to be used in almost every page? I've heard of some service called $templateCache but couldn't figure out how to use it.)
https://github.com/johnpapa/angular-styleguide This also has an example app but seriously read through his guidelines they seem to be exactly what you are looking for and have been a great resource for me as I've been learning to build bigger angular apps.
All,
We are developing our app with AngularJS and time and again we keep running into the issue of Angular running or loading controllers twice. This becomes a little more intrusive when testing our controllers and more specifically when working with Testacular with jasmine's SpyOn's (since they get triggered before our code runs). So, our question is, is there such a thing as a constructor or init method that Angular is guaranteed to call when instantiating the controllers w/o having to hack work-arounds in the test code? TIA.
If you are specifying the controller in your router, then your template doesn't need to specify the controller via an ng-controller tag. Doing so will double load your controller.
Your controllers shouldn't be loaded twice, unless you are doing something wrong. You shouldn't have to hack any work-arounds.
You might want to provide a concrete example of how you are loading the controllers (and/or the partials which are associated with the controllers). It sounds like you probably have a routing issue which is causing your view to be loaded twice for each request.
Assuming that is a routing-related issue, unless/until you can provide more information to help people to help you, you may want to read this document. Pay particular mention to sections that mention 'redirect' and 'HTML 5' mode:
http://docs.angularjs.org/guide/dev_guide.services.$location
With so little information to go on, I can't answer your question, but perhaps that link will help you to help yourself. :)
So, I'm in the midst of my first major project with Angular. I have one controller that is doing a ton of the legwork, and it's reached the point where it's thousands of lines of JavaScript.
I'd like to break this up somehow, but I can't seem to find a solid example anywhere. The code is mostly made up of functions used to do calculations on objects, so directives and modules don't seem like the right answer, but I could be wrong there.
How are you guys organizing code in your large Angular projects? Should I just suck it up, or is there a sane way to split this into easy to scan files?
I suggest putting at least some of those objects and their related calculations into services, then inject the services into your controller(s). See the Sticky Notes Part 1 blog entry for an example of a service that encapsulates some data and provides methods to access/manipulate that data.
See if you can break up your controller into multiple controllers, one for each view. A view can be as large as a page, or just some chunk/block on a page.
To quote from a google group post I saw recently: "I prefer to think of angular controllers as dumb apis/configs for my views and leave all the heavy lifting to services." -- reference
There are a few things that you need to ask yourself when you are in a controller.
Are you doing any DOM manipulation in the controller? This is a definite NO. Dont ever do that. It always belongs in the directives department.
Are you writing any Business Logic in your controller? That too is a NO. Your Business logic should in most cases exist in a Service. That is the right place for it.
Now, have a look at your controller. Is it devoid of these 2 things and still larger than 1000 lines? It is highly unlikely, but even if it somehow is happening, then consider breaking down your controller into smaller controllers. This breaking of controllers have to be done based on the view.
To sum things up, your controller is just a place where you glue up the business logic and your views in the HTML. It should technically never contain anything other than these glues.
I usually create a Util factory (seems to be the way to go now in Angular rather than services) and have it return any shared logic as a set of methods.
https://gist.github.com/lamba/c275f5f010090632209e
I'm developing a CakePHP application that we will provide as a white label for people to implement for their own companies, and they'll need to have certain customization capabilities for themselves.
For starters, they'll be able to do anything they want with the views, and they can add their own Controllers/Models if they need to add completely new stuff. However, I'd rather advise against touching my controllers and models, to make version upgrading easier.
Esentially, the customization capabilities I'm planning to give them are going to be quite basic, I just need to call "something" when certain things happen, so they can do things like update external systems, e-mail themselves/the clients, things like that.
I'm wondering what's the best way to do this?
My plan is to have a "file" (with one class) for each controller of mine, to keep things reasonably organized. This file will have a bunch of empty methods that my code will call, and they'll be able to add code inside those methods to do whatever they need to do.
The specific question is, should this class full of empty methods be a Component? A Controller? Just a regular plain PHP class?
I'll need to call methods in this class from my Controllers, so I'm guessing making it a Controller is out of the question (unless maybe it's a controller that inherits from mine? or mine inherits from theirs, probably).
Also, I'd need the implementer of these methods to have access to my Models and Components, although I'm ok with making them use App::Import, I don't need to have the magic $this->ModelName members set.
Also, does this file I create (etiher Component or Controller) have to live in the app folder next to the other (my) controllers/components? Or can I throw it somewhere separate like the vendors folder?
Have you done something like this before?
Any tips/advice/pitfalls to avoid will be more than welcome.
I know this is kind of subjective, I'm looking to hear from your experience mostly, if you've done this before.
Thanks!
Two ideas that spring to mind:
create abstract templates (controllers, models, whatever necessary) that your clients can extend
write your controllers/components/models as a plugin within their own namespace
Ultimately you seem to want to provide an "enhanced" Cake framework, that your clients still have to write their own Cake code in (I don't know how this goes together with your idea of "basic customization capabilities" though). As such, you should write your code in as much an "optional" manner as possible (namespaced plugins, components, AppModel enhancements, extra libs) and provide documentation on how to use these to help your clients speed up their work.
I would setup a common set of events and use something like the linked to event system to handle this.
That lets the clients manage the event handler classes (read the readme to see what I mean) and subscribe to and broadcast events application-wide.
Also - if you want to have your users not muck about with your core functionality I recommend you package your main app as a plugin.
http://github.com/m3nt0r/eventful-cakephp