Front End, IT, javascript, 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.
AngularJs Module and Controller

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

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


Run and Review the code


Leave a Reply

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

You are commenting using your 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 )

Connecting to %s