想實(shí)現(xiàn)這樣一個功能:
點(diǎn)擊頁面的編輯按鈕 ,頁面的數(shù)據(jù)變成可編輯狀態(tài),編輯之后點(diǎn)擊確定,編輯的數(shù)據(jù)展示在頁面上
用angular去實(shí)現(xiàn)的話,我目前的思路是,點(diǎn)擊編輯按鈕,顯示數(shù)據(jù)部分通過directive替換成可編輯狀態(tài)的模版,編輯之后點(diǎn)擊確定再進(jìn)行模版的切換,不知道可不可以這樣
就是這樣兩個模版之間切換,不用路由是不是可以實(shí)現(xiàn)?
學(xué)習(xí)是最好的投資!
給你個簡單的例子吧:
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
其實(shí)這種在點(diǎn)擊按鈕的時候改變flag變量的值,然后根據(jù)變量值展示不同的區(qū)域就可以了