How can I display images from a JSON sub-array which is received via my API?
I can display the title, the price and the description but not the actual image.
Can anyone give me a tip?
My XML:
My JSON structure:
If you just need to display one image, use a dataTransform attribute where you also have the dataCollection attribute (see https://appcelerator.github.io/appc-docs/latest/#!/guide/Alloy_Data_Binding-section-36739592_AlloyDataBinding-Collection-ViewBinding) to select/compose the image URI from the JSON and then use the property in <ImageView image="{myImage}" />
You need to loop through the image array and create the ImageView inside JS. To display the images you can use a ScrollableView (http://docs.appcelerator.com/platform/latest/#!/api/Titanium.UI.ScrollableView) and add the images as a view.
Related
In html am rendering some value in the and passing it as a input to a component like
below
<test-component
[title]= "data?.Kevin?.title"
</test-component>
Please be noted data?.Kevin?.title will give the title name.How ever, in the above, I want to render the name a bit dynamically like below
<test-component
[title]= "data?.{{name}}?.title"
</test-component>
{{name}} should render kevin and the tile value needs to be passed to the component.
Here the name is not being rendered correctly.
Any help is highly appreciated.
the solution is pretty simple: [title]= "data?.[name]?.title"
the equivalent of the first example would be: [title]= "data?.["Kevin"]?.title"
read more on https://www.w3schools.com/js/js_objects.asp see "Accessing Object Properties"
I am trying to get an image from an external source in Play Framework. When working with just the string this works fine, but I need to pass to the controller an Integer also but this always give me a not applicable to String error. I think this is because of the img src html tag I am using. item.Myjob is the string and works fine by itself, item.MyItem is the integer
<img src ="#routes.ImagesController.getImage(item.MyJob,Item.MyItem)"/>
My plan is to pass the parameters to the image controller from the parameters I have to make up the path and the image file name and then return the image. Or any other advice on how this can be achieved. Thanks
Why you want to do this?
Why not pass a list of items with their image ids, and a for loop; if you want to get the list of items and their images? Something like:
//In controller
case class Item (name: String, picId: Int, whateverElse: Any)
//In your views
#(items: List[Item])
#for(item <- items){
#item.name
<img src="whateverPath/#item.picId">
}
or...
In a case you have a small application and unique items, you could simply make the image ids the same as items' names; so you don't need to look for it.
I'm a React noob and I'm making an API request to retrieve JSON from a movie API and then displaying information about the movies, including the movie poster, in my component. I was able to retrieve and display text, but I am having trouble displaying images using JSX and the URL of the database.
I've assigned the images to post.poster_path and I'm attempting to concatenate the rest of the URL to the JSX.
<img src={"https://image.tmdb.org/t/p/w300/"+post.poster_path} alt="Movie Poster"/>
This doesn't work.
poster_path contains the image, I have verfied this in React tools. How do I properly concatenate the rest of the URL to post.poster_path?
If
post.poster_path = 'image.png'
and the whole url is
https://image.tmdb.org/t/p/w300/image.png"
for your image then the img tag will be as follows
<img src={`https://image.tmdb.org/t/p/w300/${post.poster_path}`} alt="Movie Poster"/>
In JSX if you have a value in variable and need to concat with a string you use tick `
eg. {`string ${variableName}`}
and if post.poster_path has the whole path then:
<img src={post.poster_path} alt="Movie Poster"/>
I'm looking for suggestions on how to simplify/optimize a piece of code in one of my view files in my ASP.Net MVC project. The code works, but I'm not sure if I've written it the best way.
Basically, the code is used to display a list of links to documents, with little thumbnails to the left of each link. The main problem, is that there are two different types of documents, and each type has to have it's thumbnail image stored in a different location, this is a project requirement and can't be changed.
I'm currently accomplishing this with the view code shown below.
// Display a link to every document.
foreach (var document in documentList)
{
<a href="#Url.Content("~/Document/DownloadDocument/" +
document.documentid)" target="_blank">
#{
// This will be the root of all the paths.
var path = "~/Document/DisplayImage/";
// If it's a Type 1 document, we need to use a different path.
if (document.documentType == "Type 1") {
path += "Path/To/Image/Folder";
<img id="imageHolder" src="#Url.Content(path)"
onerror="imgError(this);" />
#document.documentname
}
else {
path += "Path/To/Different/Image/Folder";
<img src="#Url.Content(path)" />
#document.documentname
}
}
</a>
<br />
}
Like I said, the code works, but I'm not too happy with how it's written. Does anyone have any suggestions?
When working with MVC, it's best to keep your Views dumb (no logic, simply rendering).
You can accomplish this by using a strongly-typed View and performing all of the logic in the Controller. It looks like you may already be doing this since you have a documentList.
In this case, documentList should be a list of View Model objects that already have the appropriate image path already set on them from the controller.
I would suggest moving the path to your document image into your model. That way you can just display the image from the path in the model and you wouldn't have to put any logic in your view.
I'm trying to dynamically load images from a certain post type. I've used the Advanced Custom Fields plugin to attach an image field to my post. I'm currently using this code:
$.getJSON('/?json=get_recent_posts&post_type=slides-verhuur&custom_fields=image', {}, function(data){
console.log(data);
});
However when I run the code, the result JSON I get contains a "custom field" attribute, which have an "image" attribute, but this only contains the value of "80", which is the ID of the image. Is there a way to get the image url instead?
You need to set Return Value as "Image URL" instead of "Image ID" Under Custom Fields group a image field as per image shown below.
$post_response->data['CFS'] = CFS()->get(false, $page->ID, array('format' => 'api'));
use 'api' instead of 'raw'