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