Front End, IT, Uncategorized

(11) AngularJs ng-src directive

In the following example, we want to display the country properties using AngularJs Code:

  • Country Flag: Path of the flag image.
  • Country Name: Palestine
  • Country Capital: Jerusalem
  • Country Language: Arabic

1. Create the module, controller, and your data.

You can return to previous AngularJs posts to learn how to write AngularJs module and controller.

screenshot-codepen.io-2018-01-30-08-47-38-632
AngularJs Module and Controller

2. Create your html file to display the country information.

ng-src
HTML Code – Use ng-src

Use ng-src for the img tag to display the country flag.

Note: If you use src instead of ng-src, you will get 404 error (Use developer tools to notice the error)

Final Output

country-info

Run and Review the code

 

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

w

Connecting to %s