routing issues with angularjs - angularjs

I am novice to AngularJS. I was using routerto move from one form to another, but I dono't know why , my routing is not working properly and it showing Loading failed for the with source error.
This is my plunker: https://plnkr.co/edit/jE195zsrQjc6pO8Ftrzw
Please let me know where I am going wrong.

Related

unreachable code after return statement Angular Material Failing when linked in index.html

Hi guys im just setting up a new project for some work im doing trying to get something working quickly to keep momentum up. However i seem to be having a problem with getting Angular Material to load properly. Im using Node and bower to get my modules which seems to be loading them fine.
However when ever im loading up the page my console reports that its hitting an unreachable code after a return statement like the title suggests. this is actually being hit in the angular material js file that is being imported by bower.
I have no idea why this is happening and any help to progress past this point would be brilliant thank you.
EDIT
I possibly have found a fix to the issue I was having. The backend of the web application I was using was controlled by Django and there was a conflict between Angular js and Django in that they were using the same tags to show values for variables. This was stopping Angular Material from instantiating properly. I still get the unreachable code warning but now Material is working as I expect it to.
I hope this helps some people debug the problems they are having when seeing this issue.
Include the minified version of the library. Automatic Semicolon Insertion is different depending on your browser, if the library code has a return statement broken across two lines, it might end up with a semicolon where one shouldn't be. Using the minified version fixes this because the statement won't be broken across lines.
Include this:
<script src="bower_components/angular-material/angular-material.min.js"></script>
Instead of this:
<script src="bower_components/angular-material/angular-material.js"></script>

initialize onsenui after document loaded

i´m trying to initialize onsenui after some js files are loaded, but then
ons.bootstrap() is causing the errors.
when i´m using a sample from onsenui everything is working quite good, but in my
project, i have to load the js files dynamically and synchronously
and then ons.bootstrap(); give me the this error
"'AppController' is not a function, got undefined"
if same js libs in same order are declared in html doc with script tags everything is working good.
i´ve found that if the scripts are loading through normal script tags and then i´m waiting till html document is fully loaded and then call ons.bootstrap() through developer tools i got same error.
so the question is how to initlaize onsen ui after document is loaded?
Hope someone can help, I´m not very familiar with angularJS/OnsenUi... first project
thanks
I have create 2 samples to demonstrate my problem.
working like onsenui samples.
jbBgmd http://codepen.io/anon/pen/jbBgmd
not working like in my case.
BoWXdP http://codepen.io/anon/pen/BoWXdP
any idea?
You are trying to load Onsen after the elements have been rendered, that's why it gave an error. You should always execute Onsen before the components are rendered.
If you want to execute some code after the DOM has been loaded, you should use ons.ready() function, you can take a look at it in the official documentation.
Here you can find the fixed and working CodePen: http://codepen.io/andipavllo/pen/ZbKzRy
Here is the edited JS:
ons.bootstrap().controller("appController", function ()
{
ons.ready(function(){
console.log("works")
})
});
Hope it helps!

Use angular in laravel views

this is my firs question here but Ive been trying to find a solution these days. Im building a multi-page website and Id like to use angular for front-end. Ive seen most of the people have the issue of combining the angular syntax with laravels but Id really like to know if its possible to include angular into one of laravels views without having to re-route to an angular.html page from angular directory.
Basically I want to know if theres a way to use angular directly into "Route::get('test', 'Controller#getTest')"
The problem is that when I set the response on the controller page( return view('pages.test')->with(array('1' => $1, '2' => $2)); ) the angular scope method gets the data as a whole and its hard to target the array 1 for example to use it in my AngularController
Hope this makes sense.... THanks in advance!

angular js template with routing and translate refusing to work

I am new to angular and it seems very interesting
I am creating a template for a promotional page and struggling to understand what is causing an issue on it - half of the script stopped working...
My fiddle is in here see >
fiddle example
or Plunker
I have working example without route...
Can you advice me how to fix this issue please
First of all, i'd suggest you to separate your project to different files based on best practises
Secondly, 'config, controller, factory' etc are methods of angular.module object. So you need to retrieve it first like
angular.module('<moduleName>').config(...)
or use some variable.
http://plnkr.co/edit/CK5R2cS7Zd9T9Kun9Epc?p=preview

Angularjs: Multiple file-uploader in a single page

I am facing lot of problem in while using more than 1 file uploader in single page. There is any directive for this? because I didn't find it. By the way I am using Bruno Angularjs uploader Directive and tried to change multiple but getting problem while form submitting beacause all uploaders sharing same model so thats why I was not able to get all the values at a time only one can be access.
So if anyone have some solution or suggestion for this, please share with me.
There is a good jquery ajax uploader which is available in angualar js version also.
Please check here http://blueimp.github.io/jQuery-File-Upload/angularjs.html

Resources