AngularJS基礎(chǔ) ng-src 指令簡(jiǎn)單示例
更新時(shí)間：2016年08月03日 09:11:16 投稿：lqh
本文主要介紹AngularJS ng-src 指令，這里對(duì)ng-src 指令的資料做了詳細(xì)整理，有需要的小伙伴可以參考下
AngularJS ng-src 指令
AngularJS 實(shí)例
添加圖片地址:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
</head>
<body ng-app="">
<div ng-init="myVar = 'http://www.runoob.com/wp-content/uploads/2014/06/angular.jpg'">
<h1>Angular</h1>
<img ng-src="{{myVar}}">
</div>
<p>該實(shí)例可以使用原生的 src 輸出，但是使用 AngularJS 代碼插入值，使用 ng-src 屬性更好。</p>
</body>
</html>
定義和用法
ng-src 指令覆蓋了 <img> 元素的 src 屬性。
如果你使用了 AngularJS 代碼設(shè)置圖片地址，請(qǐng)使用 ng-src 指令替代 src 屬性。
ng-src 指令確保的 AngularJS 代碼執(zhí)行前不顯示圖片。
語法
<img ng-src="string"></img>
<img> 元素支持該屬性。
參數(shù)值
| 值 | 描述 |
|---|---|
| string | 表達(dá)式返回的字符串。 |
以上就對(duì)AngularJS ng-src 資料的整理，后續(xù)繼續(xù)補(bǔ)充，謝謝大家對(duì)本站的支持！
相關(guān)文章
Angular中使用Intersection Observer API實(shí)現(xiàn)無限滾動(dòng)效果
這篇文章主要介紹了Angular中使用Intersection Observer API實(shí)現(xiàn)無限滾動(dòng),實(shí)現(xiàn)原理為 在data下面加一個(gè)loading元素 如果此元素進(jìn)入視窗 則調(diào)用api獲取新的數(shù)據(jù)加到原來的數(shù)據(jù)里面,這時(shí)loading就會(huì)被新數(shù)據(jù)頂下去,感興趣的朋友一起看看吧2023-12-12
這篇文章主要為大家詳細(xì)介紹了Angular的$http與$location，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2016-12-12
這篇文章主要為大家詳細(xì)介紹了AngularJS Controller的作用域，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-01-01
Angular實(shí)現(xiàn)較為復(fù)雜的表格過濾，刪除功能示例
這篇文章主要介紹了Angular實(shí)現(xiàn)較為復(fù)雜的表格過濾，刪除功能,結(jié)合實(shí)例形式分析了AngularJS針對(duì)表格的排序、查詢匹配、頁面元素屬性動(dòng)態(tài)修改等相關(guān)操作技巧,需要的朋友可以參考下2017-12-12
詳解angularjs popup-table 彈出框表格指令
本篇文章主要介紹了angularjs popup-table 彈出框表格指令，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-09-09
基于Angular 8和Bootstrap 4實(shí)現(xiàn)動(dòng)態(tài)主題切換的示例代碼
這篇文章主要介紹了基于Angular 8和Bootstrap 4實(shí)現(xiàn)動(dòng)態(tài)主題切換的示例代碼，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-02-02
使用ionic播放輪詢廣告的實(shí)現(xiàn)方法(必看)
下面小編就為大家?guī)硪黄褂胕onic播放輪詢廣告的實(shí)現(xiàn)方法(必看)。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-04-04
這篇文章主要介紹了詳解AngularJS中的表達(dá)式使用,包括處理數(shù)字和字符串等各種對(duì)象的操作,需要的朋友可以參考下2015-06-06
AngularJS實(shí)現(xiàn)ajax請(qǐng)求的方法
這篇文章主要介紹了AngularJS實(shí)現(xiàn)ajax請(qǐng)求的方法,結(jié)合實(shí)例形式分析了AngularJS實(shí)現(xiàn)ajax請(qǐng)求的前端界面、ajax交互及后臺(tái)php處理技巧,需要的朋友可以參考下2016-11-11
Angularjs編寫KindEditor,UEidtor,jQuery指令
使用過 AngularJS 的朋友應(yīng)該最感興趣的是它的指令?，F(xiàn)今市場(chǎng)上的前端框架也只有AngularJS 擁有自定義指令的功能，并且AngularJS 是目前唯一提供Web應(yīng)用可復(fù)用能力的框架。2015-01-01