I have a fairly simple app that filters a list of products.
Laravel creates the JSON feed for the products that I am reading and outputting with Angular and Laravel returns a filtered list based on what a user selects in a detailed filter form.
I have a requirement now that as a user filters results that the URL is changed in the browser and if the copy and paste it or share the link that they will be able to see the same results when the visit the app.
To do this I'll need to create routes with Angular and make use of angular partials. From reading the angular docs and watching a few screencasts it seems I need to reference partials that are html files.
Since I'm doing this with Laravel I've been using a Laravel view for my main view and using angular template tags within it and that works fine. If I want to start using partials how should I go about this? Where do I put the partials and can I reference them in my main laravel view?
Thanks!
Can you provide any samples of your views code?
You might find this helpful when working with Blade and Angular.js
http://scotch.io/bar-talk/quick-tip-using-laravel-blade-with-angularjs
If you could provide some code it would make it easier to help, I don't quite understand what you're attempting to do.
You should be able to use ng-include anywhere in your Blade view.
You can use $location to change the URL, though I'm not sure how it will handle a lot of changes in quick succession.
Related
I'm starting a PHP/JS Web project using Laravel for the back end and Angular 2 for the front end.
But I'm wondering how I should relate these two frameworks.
The two solutions I found was :
1 - Writing the whole Angular project in laravel's public folder and launch it from a app.blade.php in a Laravel view. Which makes it easy to pass the Laravel Auth data to Angular, but makes the public folder quite huge and probably too messy.
2 - Having two separate projects. And call the Laravel's api routes using JWT (I don't know a lot about that but read that it was a nice option).
So my question is, which of these 2 solutions is the best and why ?
Thanks
Hello I'm gonna give you a third option, which is the one I use for my projects with Laravel + AngularJS
So I use Laravel for 2 things:
*Retriving views
*Managing an API
For example if you request something like project.com/users Laravel will manage this and return the users.blade.php view
Then in this view I use angular to ask for data to the API (In laravel) and retrive it and load it on the HTML.
With this I take advantage of Sessions with Laravel (By retriving the views) and I take advantage of AngularJS with controllers and data-binding.
Also the directory structure is ordered because all views are in resources/views and for the controllers of angular I put them on public/js/controllers.
Hope this help you
I'm thinking about making a sort of admin panel in angularjs. I need a way to edit the content of the site, like e.g. Wordpress offers (basically a CMS).
The confusing bit is how the CMS and Angular would integrate together
In other CMSs, the creation of the views happens on the server side. In Angular we creare a HTML template, which you can populate with data in an angular controller.
I am a bit stuck as to how to define templates and then on click position the templates accordingly..
Please suggest a way to help achieve this
Althought you seem to have an understanding how Angular works, some fundamental information is missing in your question. I guess you want to persist the content of the CMS, so you have to provide some details about the server part (I don't think you are going to use clientside storage solutions).
Additionally your question how to position templates is a bit confusing. Typically you are not dynamically positioning templates. Rather you have a template and position some elements inside of the templates. You should concretise your problem here.
Maybe you want to use some existing CMS solutions based on Angular like:
http://respondcms.com/
https://github.com/jonniespratley/angular-cms
I'm building a web site (no SPA) with Laravel and Angular Js.
So far it works like this: All routing is made by laravel Router (the views are displayed by laravel controllers), but all the CRUD operations are made in asynchronous requests by angular (save, delete, view).
So far I had very simple views: one form to create resources on one column and a list of resources on another column. Like this
The problem is that the last form has a lot of fields and i want to split it in two separate views. I read about angular routing but the way i see it, you must configure the routing for the whole angular module and i want to use it only for this specific controller. What's the best approach on this one?
So this is how i decided to go after reading a lot, create a new module for my big view and configure the routing only for the new module. I hope this helps someone eventually.
I want to create an android application using Cordova, and I am using angularjs to fetch and handle data from the service end-point of a Drupal website. Initially I tried to use ngRoute of Angularjs but didn't seem to fit properly, so I turned to 'ui-route'. But I facing problems with ui-route as well.
My main aim is to use a particular view/template for multiple pages. I am new to Angularjs, so kindly help me choose the best way to proceed. My main question is how to handle multiple pages, can we just have each page as separate html file and link them or use routing. I tried to look into many tutorials but nothing helped me. Even giving an example would be enough.
I understand your problem. You can achieve this via $stateProvider but you don't know how. I am giving you a application link there you can see how to use $state.
kitchensink
download this application.
if you want to reuse your template then use custom directive and see this or more info angular
Currently I am working on my app and I decided to use AngularJS as a framework to structure my front-end code. However, I don't have any experience with AngularJS and thus, am currently struggling with the concepts and logics of it.
Below you can see a rough draft of my app's scaffold:
So what I am trying to do is to create a single page application for my whole app.
Within the <menu bar> one can select different pages to display within the workspace. I learned that I can realise this behaviour by using the <ng-view> directive.
However, what I want to do is, depending on the buttons clicked within the <workspace> (-> the currently loaded view) I'd like to show different <sidebars>.
For example: If one clicks on an edit object button within the workspace, the form to edit the object will be loaded into the sidebar.
At first I though I could solve this by using multiple ng-view directives within the app, but I learned that this is not possible.
So, do you have any ideas on how to realise the above described behaviour?
I would like to asynchronously load <sidebar> templates whenever they are needed within the app. These sidebar templates should contain some logic, e.g. buttons to submit data etc.
I really don't know how to realise this behaviour, as I'm as well struggling with how to use scopes and controllers in this context.
Any ideas, articles, examples are highly suggested! Thanks.
Edit: I created a small and only minimalised draft of how I imagine AngularJS would handle the process:
You can use Angular-UI.
The UI-Router has much more powerful routing features than the default AngularJS router.
For the views, with Angular-UI, you can have multiple views in a same document (ui-view) and each can load a different template depending on the current application state (the URL).
Here is the documentation for these components:
http://angular-ui.github.io/ui-router/site/#/api/ui.router.state.directive:ui-view
https://github.com/angular-ui/ui-router/wiki
You definitely should check it out!
Please note that once you'll get your two templates, they will be in different scopes so you'll need some sort of communication service to handle passing data from one scope to another without getting into a $watch or $rootscope hell.