I am using the Routing and Multiple Views feature of AngularJS but I don't see the HTML partial file (or the embedded Javascript) in Chrome's "Sources" tab of the Developer Tools.
In my index.html file, it includes all the tags for AngularJS, jQuery and Bootstrap along with my custom app/controller Javascript file. These files all appear in the Sources tab.
My application works correctly. As I click around between the links on the page, the partial HTML files are loaded and displayed and the files are listed in the Network tab.
The problem is that the partial HTML files do not appear in the Sources tab. How can I debug the Javascript in those partial files?
It looks like the closest thing to a debugger is Zone.js from the Angular team, especially since it will be built right into AngularJS in the future.
This means adding some more code, but the benefits seem to outweigh the cost.
Related
I am trying to load many x3d files in a single HTML file using Inline. Some of the scenes load normally but others hang on Loading. It seems there is a limit in the total number of scenes that could be rendered in a single HTML file.
Is this true? Is there any solution to this problem? I want to display as much scenes as needed.
Here is the Link to the example folder where I am calling "Deer.x3d" files several times inside the HTML file.
This example was viewed using Firefox. Using Interned Explorer or Chrome might not work since they don't allow loading local files.
Tested your page also in x_ite which gives better error messages in console. Browsers has limitation in creating WebGL objects like framebuffers. If you create 100 X3D browser within a html page 100 frambuffers or other objects must be created, which are not supported by all browsers.
A better solution is to create preview images of your x3d scenes and on click, or what ever you prefer, open a X3D browser.
I am currently working on a website and during the loading of the entire page, the page is "jumping" so that I would like to know how I can create an entire ,let's say black screen, where something is displayed during the time the page loads.
That seems quite easy but I was wondering because I have separate files for the header, the footer and the content on how to coordinate all of them, and still have a nice code.
I am working with angularJS. I read a lot about : $viewContentLoaded and also tried ng-cloak, but if any of you has an awesome solution to keep simple, it would be great :)
Thanks
I would say that one approach you can take is use some sort of templating engine for your HTML files (like Jade for example). In this way, you can keep all the code nicely separated in multiple files and using a task runner like Gulp or Grunt you can compile your HTML files before serving the page.
The important difference here is the fact that you won't have to load all the page parts (header, footer and so on) using AJAX requests. Instead, they will already be rendered in your HTML page allowing you to create a nice loader using ng-cloak on your content part.
I have got an angular project generated with yeoman/generator-angular with both mobile and desktop views. The mobile templates heavily rely on mobile-angular-ui and it works just fine in development.
For some reason the modals are not displayed after grunt build. Instead, calling a modal would act as if a transparent component was added on top of the page (I mean, with the highest z-index), stealing the focus in the same way that a modal would do. As a consequence, the modal itself is not displayed and the page does not respond to any click event (assuming the fake modal is locking the focus).
The content of my modals is loaded via ng-include directives and it seems to work (from what I can see in the network tool of Chrome). There are no error message complaining about a missing resource in the console and the only thing I can think of is that the code responsible for toggling the modals visibility in mobile-angular-ui was somehow impacted by the build process. Sounds possible?
Any idea of what could cause this difference of behaviour between dev and production?
I am using mobile-angular-ui 1.2.0-beta.11. Feel free to request more information.
Bingo. The problem actually came from a clash between mobile-angular-ui and bootstrap, as I was using both of them for the mobile and desktop views respectively.
Since I use a very limited subset of bootstrap, I decided to remove all my bootstrap dependencies and only work with mobile-angular-ui which also provides a minimalist support for desktop views (namely col-md-xx etc. for responsive layouts).
I don't know about mobile-angular-ui, but in Angular ui-bootstrap you need to include not only the main code but also the templates:
<script src="bower_components/angular-bootstrap/ui-bootstrap.min.js"></script>
<script src="bower_components/angular-bootstrap/ui-bootstrap-tpls.min.js"></script>
When you don't include the tpls, the development is still working, because it's able to load the files from their location in bower_components.
In production you get a similar result as you describe when using modals, because the templates were not bundled in your dist directory. Maybe it's a similar problem?
I have an EXTJS app and when I look at the source by using browser's inspect element I can see my entire app's source code (except for the server-side code ofcourse.).
I have seen some extjs apps that when inspecting theie source code, all I can see is the app.html page and non of their .js files is discover able by the browser.
I was wondering how I should configure my EXTJS app to make them not viewable inside the browsers "Sources" tab (ie. Chrome's Inspect Element > Sources).
Any help is much appreciated,
The best you can do is to obfuscate your code, as there is no way to stop someone looking at it once its got to the browser.
Even if the browser could hide it somehow, there is nothing stopping a user sniffing the packets on the network etc.
velocity templates works fine in developing web pages. But i would also like to include certain jsp pages inside my velocity template to include certain functionalities. But when i try, #include("xyz.jsp") it simply pastes the file in my template rather than binding it..kindly help me out..
You need to being using VelocityTools' ImportTool.