I am trying to display the data as follows (doesn't work):
{{#each request}}
<div class="col-sm-4 col-lg-4 col-md-4">
<div class="thumbnail" style="padding:0;border:0px;height:300px;overflow-y:auto">
<img src="{{URLs[0]}}" alt="">
<div class="container">
<h4>{{title}}
<h4 style="color:red;">{{status}}</h4>
</h4>
</div>
</div>
</div>
{{/each}}
and I get the following error printed in the console:
Exception from Tracker recompute function: debug.js:41 Error: Can't
call non-function:
https://firebasestorage.googleapis.com/v0/b/omantourplacesapp.appspot.com/o/TourPlacesImages%2FIMG_0005.JPG?alt=media&token=22ab7965-3b03-4e7f-9798-99617b82dd9b
When I replace the following line:
<img src="{{URLs[0]}}" alt="">
With:
<img src="https://upload.wikimedia.org/wikipedia/commons/0/0f/2010-02-19_3000x2000_chicago_skyline.jpg" alt="">
It works and I can see the image showing in the browser.
Why Firebase images are not working?
NOTE: I am building native IOS application and I could retrieve the same image using the same Firebase URL there.
Don't use brackets use {{URLs.0}}
Related
Generating documentation in an ASP.NET Core MVC app. The view renders headings with ids and the contents of other sections needs to link to them.
Example view:
#foreach (MyObject thing in Model)
{
<h5 id="#thing.Name">#thing.Name</h5>
<h6>List</h6>
#foreach (MySubObject otherThing in thing.SubObjects)
{
<div class="row">
<div class="col-md-4 col-sm-6">#otherThing.Name</div>
<div class="col-md-4 col-sm-6">
#if (otherThing.HasParent)
{
<a href="#($"#{otherThing.ParentName}")">
#otherThing.ParentName
</a>
}
</div>
</div>
}
}
This generates exactly what I want it to:
<div class="row">
<div class="col-md-4 col-sm-6">OtherThing7Name</div>
<div class="col-md-4 col-sm-6">
<a href="#ParentName">
ParentName
</a>
</div>
</div>
...
<h5 id="ParentName">ParentName</h5>
But the link, when I hover over it, goes to http://localhost/#ParentName instead of preserving the route data e.g. http://localhost/Documentation/Things#ParentName, so instead of just jumping to that location on the page, it takes it to the root of the application.
Update:
Okay, it looks like this is happening because <base href="~/" /> is defined in the View Layout being used (which all Views in the application use). Removing it allowed the link to work as expected, but I don't know what effects it would have on the rest of the site.
I want to use NG-ZORRO pagination in the Html page, it's working but fine but how do I link content with the pagination?
This is my Html code
<div class="row card-group-row">
<div class="col-md-6 col-lg-4 col-xl-3" *ngFor="let course of draftCourses"> //I want to paginate this data
<div class="card-blog">
<a href="#">
<img src="../assets/images/image.jpg" alt="" class="img-blog" />
</a>
<div class="card-blog-wrap">
<a href="#">
<h4 class="title-blog">{{course.course_title}}</h4>
</a>
</div>
</div>
</div>
<nz-pagination [nzPageIndex]="1" [nzTotal]="500" [nzPageSize]="2" id="demo"> </nz-pagination>
</div>
I am getting pagination in HTML but it's not linked with the content. I have used ngx-pagination before but I want to use nz-pagination in my code, so can someone help me how to do it.
This is the official link for NG-ZORRO Click here for link
Thanks in advance.
You need to implement event which will trigger on page index change.
For binding use (nzPageIndexChange):
<nz-pagination [nzPageIndex]="1" [nzTotal]="500" [nzPageSize]="2" (nzPageIndexChange)="onPageIndexChange($event)" id="demo"></nz-pagination>
Then in your component you can implement like below:
export class YourAngularComponent{
onPageIndexChange($event) {
//do something here to go to next page
}
.
.
}
I'm pulling data from an external site using WP-API and displaying it using AngularJS - http://dev.5874.co.uk/goshooting/search-the-shooting-club-directory/
The data is pulling in fine but it's showing the HTML tags such as how can I stop this? I'm using Advanced custom fields too which may be contributing.
<div ng-controller="northWestCtrl">
<div ng-repeat="d in data">
<h2 class="entry-title title-post">{{d.title}}</h2>
<img src="{{d.acf.logo}}">
<div id="listing-contact">Contact: {{d.acf.contact}}, {{d.acf.position}}</div>
<div id="listing-address-1">
{{d.acf.address_1}}, {{d.acf.address_2}} {{d.acf.address_3}} {{d.acf.town}} {{d.acf.county}} {{d.acf.postcode}}
</div>
<div id="listing-phone">Telephone: {{d.acf.telephone}}</div>
<div id="listing-mobile">Mobile: {{d.acf.mobile}}</div>
<div id="listing-email">Email: {{d.acf.email}}</div>
<div id="listing-website">Website: {{d.acf.website}}</div>
<div id="listing-established">Established: {{d.acf.established}}</div>
<div id="listing-about">About: {{d.acf.about}}</div>
<div id="listing-mailingaddress">Mailing Address: {{d.acf.mailing_address_}}, {{d.acf.mailing_address_2}}, {{d.acf.mailing_address_3}}, {{d.acf.mailing_town}}, {{d.acf.mailing_county}}, {{d.acf.mailing_postcode}}</div>
<div id="listing-directions">Directions: {{d.acf.directions}}</div>
<div id="scd-link">View on The Shooting Club Directory</div>
</div>
</div>
</div>
Here is a working code pen also - http://codepen.io/anon/pen/yePYdq
Any help would be much appreciated, thanks!
If i understand you right you Use this site for getting your data http://scd.blaze.wpengine.com/wp-json/posts?type=listings&filter[listing_area]=northeast with API
Also your console display an error
[Error] XMLHttpRequest cannot load http://scd.blaze.wpengine.com/wp-json/posts?type=listings&filter[listing_area]=northeast. Origin http://dev.5874.co.uk is not allowed by Access-Control-Allow-Origin.
Maybe this link will be helpful Origin is not allowed
I am using Ckeditor in Drupal.
I have tried to add the following code in the block content using ckeditor
<header>
<div class="container">
<div class="row">
<div class="col-lg-12">
<img class="img-responsive" src="img/profile.png" alt="">
<div class="intro-text">
<span class="name">Start Bootstrap</span>
<hr class="star-light">
<span class="skills">Web Developer - Graphic Artist - User Experience Designer</span>
</div>
</div>
</div>
</div>
</header>
But the above code displaying like this
<header></header>
Inside contents are not displaying. I don't know what is happening inside. Did anyone know about this?
This has to do with the cleanup and output settings of both Drupal and CKEditor. The fastest and most effective way to achieve this is by creating a new input format, for example "HTML" via /admin/config/content/formats/add with all cleanup processing disabled. This way, your HTML input = HTML output.
Sidenote: Make sure your profile/the admin profile/role is the only role that is able to use it so only trusted users have access to this text-format.
I'm using Visual Studio 2012 for an MVC web app using code first method with EF 5.0.
I have written the following code to make a modal window appear at some point:
<div id="mod" style="display:none;">
<div id="mod-container">
<div id="mod-close"><img src="~/Content/icons/close.png" title="close" onclick="$('#mod').fadeOut();"/></div>
<div id="mod-content"></div>
</div>
</div>
If works fine, exept that the image <img src="~/Content/icons/close.png" [...] /> cannot be found by the browser which thinks its URL is
http://localhost:49895/Class1/Home/~/Content/icons/close.png
To be precise, every code under my div's got broken URL. If I put my image above the div's it's displaying correctly with the following URL:
http://localhost:49895/Content/icons/edit.png
Do you have an idea where i messed things up?
Edit2: example (after problem being resolved)
This works:
<img src="~/Content/icons/close.png" title="close" onclick="$('#mod').fadeOut();"/>
<!-- comment containing a quote ' -->
<div id="mod" style="display:none;">
<div id="mod-container">
<div id="mod-close"></div>
<div id="mod-content"></div>
</div>
</div>
This doesn't work:
<!-- comment containing a quote ' -->
<div id="mod" style="display:none;">
<div id="mod-container">
<div id="mod-close"></div>
<div id="mod-content"></div>
</div>
</div>
<img src="~/Content/icons/close.png" title="close" onclick="$('#mod').fadeOut();"/>
Could be a bug in the new Razor 2.0 tilde parsing, or you've mucked up your html by missing a quotation mark or something. Try using the more explicit way of resolving urls
<img src="#Url.Content("~/Content/icons/close.png")" />
If that works then it suggests a razor bug, if it doesn't then your html is probably broken somehow but the extra # symbol may be enough for the parser to kick in and tell you what is wrong.
~ is an asp code element, not HTML. As such it doesn't get rendered by the HTML.
Try wrapping your src with #Url.Content
<img src="#Url.Content("~/Content/icons/close.png")" />