Prior to vue being part of Laravel, I would often debug by simply using {{ dump($var) }}
Doing so now throws an exception within javascript as Vue doesn't like <script> tags within the body of the content. It's not game breaking, but it is annoying. It still shows the whole array, just that the JavaScript around it doesn't work anymore.
Is there a Vue equivalent of laravel's dump? Can I tell Vue to ignore script tags when doing debugging?
To be clear, I'm looking to output the variable from PHP where it shows the properties, attributes, the type of value etc. I'm not looking to output an object within JavaScript.
console.log() will work but it will work only via javascript but i personally suggest that you will use vue.js plugin from browser? its way better to understand what is really happening on your vue variables in the back.
heres the link for
vue dev tools chrome
then on your browser(F12) u will find it from Vue tab together console,network html.
You just need to have the dump() outside the div your vue app is mounted to. So for example in your layout.blade
<body>
#yield('dump')
<div id="app">
Then in your index.blade
#extends('layout')
#section('dump')
#dump($variable)
#endsection
You can try {{ var_dump($variable) }}
If you are just looking to see the contents of the variables you are working with you can use the PHP functions var_dump() instead of dump(). It's not styled in the same sleek way that dump() is and you can't collapse or expand sections like you can with dump(). But it will dump the data you need without messing with your Vue code.
{{ dump($variable) }} without Vue:
{{ var_dump($variable) }} with or without Vue:
Related
I am trying to add a new view to my laravel project, and it is just dumping the entire content on the page, including my blade code, instead of executing said code. For example, my page in the browser is this:
#extends('user.layouts.app') #section('title', 'New Reminder') #section('content')
New Reminder
#csrf
Title
Content
#endsection
When it should obviously be executing that code, not putting it on the page.
I have tried clearing the routes, and researched around but no dice.
I am calling this view the same way I am calling others in my code - in the controller like this:
return view('user.partials.stat_types.new_type');
Any help or advise is appreciated!
You must have the file name with the extension .blade.php if you want Blade to be used to compile the view. With just .php the PHP engine is used.
Change your view filename to have the .blade.php extension.
I'm working inside Fat-Free-Framework, using the F3 Template Language, but I've come across an issue I'm not sure how to solve.
I've got a portion of a webpage, which contains data from a database that needs to be updated at some interval to make sure the person looking at the page is looking at up-to-date information.
I can easily load the data this way:
<div id="container">
<include href="module/views/table_pending.htm"/>
</div>
This works, but it doesn't update at an interval. I know I need to use jQuery for this, so I tried to use the load() method to load this page fraction, but it isn't rendering properly.
This is my Javascript
function loadPageContents() {
$('#container').load('{{#BASE}}/app/modules/module/views/table_pending.htm');
}
loadPageContents();
Here is a minimal version of my table_pending.htm:
<repeat group="{{ #data }}" value="{{ #device }}">
{{ #device[uid] }}<br>
</repeat>
When using F3's include element, my page renders as expected:
But when using jQuery .load(), it seems that F3's template language isn't really parsed at all (thus variables not being replaced, loop not working properly etc):
So my question is, how can I include this page fragment into my main page, update it on an interval, and still render my template language?
I am using Laravel and AngularJS for my project. I changed the Angular curly brackets to {[{ because of, blade uses the same. I got some data with an $http.post() in AngularJS and I want to print this data in my views, witch I have made in Laravels blade. Because of, I am printing data from AngularJS I am using ng-repeat:
<tr ng-repeat="school in data.result">
<td>{[{ school.name }]}</td>
<td>{[{ school.brin }]}</td>
<td>{[{ school.city }]}</td>
<td>{[{ school.phonenumber }]}</td>
</tr>
This works fine. The problem is: how can I print an value inside {{ URL::to('scholen/bekijk/') }}?
Something like:
{{ URL::to('scholen/bekijk/'. {[{ school.id}]}) }}
I tried a lot, but I got errors only ;)
Something like:
{{ URL::to('scholen/bekijk/'. {[{ school.id}]}) }}
You can't.
Why? Blade is processed with PHP, which is server-side.
AngularJS processes client-side, once any/all Blade processing is completely finished.
that is because
{{ URL::to('scholen/bekijk/'. {[{ school.id}]}) }}
this code is interpret by php. but the syntax is incorrect acceding to php. because php accepts {[{ school.id}]}) part as a interpret-able php thing but its not. if u can put {[{ school.id}]}) inside the string then php is not going to interpret is because its know its just a string. but in angular side angular knows that's is a something that angular should do because the string includes {[{ school.id}]}) .
so u can try something like,
{{ URL::to('scholen/bekijk/{[{ school.id}]})' }}
You should really pick one and stick with it, by that I mean don't try and mix Blade and Angular. If you want to go with Angular pages, then make them all Angular, not some kind of Blade-Angular hybrid.
When working with Angular and Laravel I completely remove any view logic from Laravel, and use it purely as the back-end logic. Angular is responsible for all the view templating and rendering.
I suggest don't mix angular and blade...
Look at this: https://github.com/Ferticidio/UPEnews/blob/master/app/views/indexangular.blade.php only load angular...
and: https://github.com/Ferticidio/UPEnews/tree/master/public
In public i push all the angular logic...
This was very fast and comprensive for me..
So my dilemna is this.
<p>Email: info#example.com</p>
Is being processed as blade code and won't re-size in my responsive bootstrap web page in my Laravel 4 framework.
Any ideas on how to get blade to ignore the # symbol? It is probably a simple fix I just can't find it on the web.
Thanks
A really simple way would be this:
someone{{'#'}}email.com
{{ $whatever }} effectively gets transformed into <?= e($whatever) ?> (where e() does HTML escaping) so you can put a string there, and that will get output instead of a variable.
The following will avoid blade syntax:
<p>Email: info<?php echo urldecode('%40')?> example.com</p>
%40 is equivalent to #
There are also HTML helpers in Laravel,
you can use the following to generate a mailto tag with an obfuscated email address:
# Generating obsufscated mailto tag
{{ HTML::mailto('myemail#mail.com','Some person'); }}
// Generates :
Some person
View more of these helpers at http://www.laravel-tricks.com/tricks/generating-html-using-html-methods
Let's say I have a piece of jQuery javascript that binds to a div on load and dynamically defines an img in that div. Something like this:
$(document).ready(function() {
$("#container").html("<img href='/images/myimage.jpg/>');
});
If I were to use this inlined in a Laravel view, I'd be able to use HTML::image() and Blade templates to specify the location of image. Something like this:
$(document).ready(function() {
$("#container").html("{{ HTML::image('images/myimage.jpg', 'My image') }}");
});
If I were then to take that piece of javascript, and, instead of inlining it in the view, place it inside a separate .js file, say, public/js/image.js, I could have Laravel load it as an asset;
Asset::add('image.js', 'js/image.js');
However, since it's now treated only as an asset, neither the Laravel PHP nor the Blade templating code is processed, so we literally get the string {{ HTML::image('images/myimage.jpg', 'My image') }} in the resulting html, instead of the templated-in values.
Is there a good approach for something like this?
I'm doing this here. The way I found was:
1 - create a 'js' file inside the view directory tree, something like
app\views\javascript\mycustomJS.blade.php
2 - then render it wherever you need:
<script>
#include('javascript.mycustomJS')
</script>
It's blade, it will be processed as it should.
This is far from ideal, I know, but it works for me, for now. :)
I think you can put it in a php file. I've done this before with css.
Asset::add('image.php', 'js/image.php');