angular.js - angularjs directive怎么實現通過點擊事件更換模版?
問題描述
想實現這樣一個功能:點擊頁面的編輯按鈕 ,頁面的數據變成可編輯狀態(tài),編輯之后點擊確定,編輯的數據展示在頁面上
用angular去實現的話,我目前的思路是,點擊編輯按鈕,顯示數據部分通過directive替換成可編輯狀態(tài)的模版,編輯之后點擊確定再進行模版的切換,不知道可不可以這樣
就是這樣兩個模版之間切換,不用路由是不是可以實現?
問題解答
回答1:給你個簡單的例子吧:
var demo = angular.module(’demo’, []);demo.directive(’demoDir’, function(){ return { restrict: ’A’, scope: {}, link: function($scope, element){$scope.city = {};$scope.edit = function(){ $scope.isEditing = true;};$scope.confirm = function(){ $scope.isEditing = false;}; }, template: ’<p ng-if='!isEditing'>城市: {{ city.name }} <button ng-click='edit()'>編輯</button></p><p ng-if='isEditing'><input ng-model='city.name'/><button ng-click='confirm()'>確定</button></p>’ };});
plunker
回答2:其實這種在點擊按鈕的時候改變flag變量的值,然后根據變量值展示不同的區(qū)域就可以了
相關文章:
1. angular.js - 輸入郵箱地址之后, 如何使其自動在末尾添加分號?2. 管理員信息修改時的密碼問題3. html5 - 為什么使使用vue cli 腳手架,post-css 沒有自動對css3屬性自動添加瀏覽器前綴呢?4. javascript - html5的data屬性怎么指定一個function函數呢?5. mysql - 電商如何存儲營業(yè)額數據6. javascript - 后臺管理系統(tǒng)左側折疊導航欄數據較多,怎么樣直接通過搜索去定位到具體某一個菜單項位置,并展開當前菜單7. android - RxJava 中有根據條件執(zhí)行不同函數的操作符嗎?8. java如何生成token?9. javascript - 如何使用nodejs 將.html 文件轉化成canvas10. python - Scrapy存在內存泄漏的問題。
