I stored the image path in MongoDB but when I'm trying to get the image path into the src attribute of the img tag, it keeps inserting apostrophes at the beginning and the end of the image path.
<img src=“{{ this.img }}” alt="Alt text">
Viewed from Chrome Dev Tools:
<img src="'/img/thisisanimage.jpg'" alt="Alt text">
Any reason why this might be happening?
you should use it like this:
<img src="{{ img.src }}" alt="Image is broken" />
Related
When I add a smile - img src is
<img alt="smiley" src="http://127.0.0.1:8000/static/ckeditor/ckeditor/plugins/smiley/images/regular_smile.png"
How change default to URI:
<img alt="smiley" src="/static/ckeditor/ckeditor/plugins/smiley/images/regular_smile.png"
I addet text from local domain to DB. And on server domain its not worked.
I'm working in the Laravel web-app. My images are stored in "public/assets/dist/img"
What I'm using in my view is :
<img src="{{asset('dist/img/user1-128x128.jpg')}}" alt="User Avatar" class="img-size-50 mr-3 img-circle">
but when I try to execute my Laravel app using "php artisan serve" I see my images are broken, when I try to inspect and get image src that is: http://127.0.0.1:8000/dist/img/user1-128x128.jpg
It shows 404 | Not Found page.
I double checked that image with name "user1-128x128.jpg" exists in "public/assets/dist/img"
Why I'm not able to see the image?
Is there something I'm missing?
It would be :
{{ asset('/assets/dist/img/user1-128x128.jpg') }}
assuming that your /assets/dist/img/user1-128x128.jpg is under /public/
I am trying to build a simple gallery using python and Flask but I got stuck getting the path of the images IF the images are in a subfolder under the main folder static.
The folder structure I got is: 'static' >> 'images'
The following code is working IF the images are un the root of the folder 'static'.
app.py
#app.route("/")
def home():
image_names = os.listdir('./static/')
# print(image_names)
return render_template('index.html', image_names=image_names)
index.html
{% for image_name in image_names %}
<img src=" {{url_for('static', filename=image_name)}}"> {% endfor %}
But I can not figure out how I can add 'images' in the path of the url
{{url_for('static', filename=image_name)}}">
I have tried many different ways, watched tutorials, read the docs but I just got errors...
> I am learning Python and Flask so, please don't be mean in your comments...
use {{ url_for('static', filename='folder_name/file_name') }}
hope that will help you
You can use something like this:
#app.route('/static/images/<filename>')
def get_images_route(filename):
return './static/images/' + filename
in HTML
<img src=" {{url_for('get_images_route', filename=image_name)}}">
I need to display related image in ngFor
Like
<div class="row" *ngFor="let name of cheaterNames">
<div class="col-4">
{{ name.name }}
<img src="{{name.path}}" class="rounded mx-auto d-block">
</div>
</div>
This is how the data look like in database
_id OgjectId("566666tyyhhhh")
name Laravel
path uploads\logo.png
This how my project folder looks like
Project
client
about
about.component.html // this the html i used to display images
about.component.ts
dist
e2e
node_modules
server //this is where express/nodejs
controllers
models
routes
app.ts
uploads // this is where the images is stored during file uploads
logo.png
other imgs...
Any ideas for this? The image does not show up and shows 404 error
Your paths will all be relative to the base content directory for your web server which is probably not your project's home directory. Basically, the uploads directory is not within your base content directory, so your image files will not be found by the server at runtime. You need to determine where your base content directory is (express server configuration) and ensure that your uploads directory is under that directory.
For example, if you're serving up a build from the dist directory, uploads should be under dist;
How can I generate this HTML using Jade
<a class="btn btn-primary btn-large" data-toggle="modal" href="#websiteModal">
<i class=" icon-map-marker icon-white"></i>
Configure for Website</a>
I tried
a.btn.btn-primary.btn-large(data-toggle="modal",href="#websiteModal") Configure for Website
i.icon-map-marker.icon-white
But it puts the <i> after "Configure for Website" text.
You can either do:
a.btn.btn-primary.btn-large(data-toggle="modal",href="#websiteModal")
i.icon-map-marker.icon-white
| Configure for Website
Or if you are feeling fancy:
a.btn.btn-primary.btn-large(data-toggle="modal",href="#websiteModal")='Configure for Website'
i.icon-map-marker.icon-white