利用Angular.js編寫公共提示模塊的方法教程
前言
在編寫一些大型工程的時(shí)候，會(huì)經(jīng)常遇到一些公用提示，使用框架自帶很多時(shí)候不方便，于是我手寫了一個(gè)，下面來(lái)看看詳細(xì)的介紹：
效果圖如下
方法如下
一、先在angular中注冊(cè)一個(gè)模塊
二、
注冊(cè)一個(gè)模塊 注入依賴
三、
返回不同的方法應(yīng)對(duì)不同情況
四、
獲取模板路徑
五、
編寫模板內(nèi)容 和普通的頁(yè)面一樣調(diào)用使用angular服務(wù)
六、
1. 開啟http服務(wù)獲取模板內(nèi)容
2. 重點(diǎn)注意 $template = $compile(template)(scope); 這句代碼非常重要 用于激活模板內(nèi)容轉(zhuǎn)成angular能識(shí)別的html代碼片段
3.提示框消失時(shí)間 設(shè)置回調(diào)函數(shù) $template.detach();用于模板消失
七、
設(shè)置html代碼內(nèi)的變量
1.由于不在控制層 $scope對(duì)象無(wú)法獲取不了值 所有需要用代替值 需要在使用時(shí)將$scope傳入
八、使用方法如下
記得在控制器里面注入alertModel模塊
九、使用效果
總結(jié)
以上就是這篇文章的全部?jī)?nèi)容了，希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作能帶來(lái)一定的幫助，如果有疑問大家可以留言交流，謝謝大家腳本之家的支持。
相關(guān)文章
這篇文章主要介紹了Angular CLI 使用教程指南參考小結(jié)，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來(lái)看看吧2019-04-04
Angular中ng-bind和ng-model的區(qū)別實(shí)例詳解
這篇文章主要介紹了Angular中ng-bind和ng-model的區(qū)別實(shí)例詳解的相關(guān)資料,需要的朋友可以參考下2017-04-04
angular實(shí)現(xiàn)input輸入監(jiān)聽的示例
今天小編就為大家分享一篇angular實(shí)現(xiàn)input輸入監(jiān)聽的示例，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來(lái)看看吧2018-08-08
angular inputNumber指令輸入框只能輸入數(shù)字的實(shí)現(xiàn)
這篇文章主要介紹了angular inputNumber指令輸入框只能輸入數(shù)字的實(shí)現(xiàn)，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2019-12-12
Angular?Tree?Shaking優(yōu)化機(jī)制原理詳解
這篇文章主要為大家介紹了Angular?Tree?Shaking優(yōu)化機(jī)制原理詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-10-10
Angularjs Ng_repeat中實(shí)現(xiàn)復(fù)選框選中并顯示不同的樣式方法
今天小編就為大家分享一篇Angularjs Ng_repeat中實(shí)現(xiàn)復(fù)選框選中并顯示不同的樣式方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來(lái)看看吧2018-09-09
AngularJS實(shí)用基礎(chǔ)知識(shí)_入門必備篇(推薦)
下面小編就為大家?guī)?lái)一篇AngularJS實(shí)用基礎(chǔ)知識(shí)_入門必備篇(推薦)。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來(lái)看看吧2017-07-07
本文給大家總結(jié)了一些angularjs的基礎(chǔ)知識(shí)及相關(guān)示例，分享給大家，希望能對(duì)大家有所幫助。2015-01-01
本文介紹了AngularJS 多指令Scope問題的解決，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來(lái)看看吧2018-10-10
angular2+node.js express打包部署的實(shí)戰(zhàn)
本篇文章主要介紹了angular2+node.js express打包部署的實(shí)戰(zhàn)，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來(lái)看看吧2017-07-07