angularjs - How to update view when scope does not change -
there textarea input. , 2 buttons click.
`<textarea ng-bind="msg"></textarea> <div class="cancel-btn" ng-click="is_hide=false;"></div> <div class="submit-btn" ng-click="submit_card()"></div>` what process ?
input characters in textarea, click 'submit-btn', scope save 'msg'. if click 'cancel-btn', scope won't save msg.
what want ?
after save msg, input , click 'cancel-btn', want textarea's innerhtml scope.msg instead of input.
#
now, want exec $scope.$apply() update dom, alert error $digest in progress.
#
maybe need ng-model textarea, , use other param saved_msgsave msg, when click 'cancel-btn', make msg = saved_msg. but, there convenient ways ?
-------------------update 6/25-----------------
`<div ng-controller="ctrl"> <div ng-class="{'selted':cid == 0}" data-cat="0"></div> <div ng-class="{'selted':cid == 1}" data-cat="1"></div> <div ng-class="{'selted':cid == 2}" data-cat="2"></div> <textarea ng-bind="msg"></textarea> <div class="cancel-btn" ng-click="is_hide=false;"></div> <div class="submit-btn" ng-click="submit_card()"></div> </div> in fact, use directive byjquery` change dom class, when click 'cancel-btn', want refresh dom decide scope. may similar $render.
--------------------update 6/26-------------- thank help. find way solve problem.i add div#main contain want save/refresh. ps: care change! follow way. maybe have better way, welcome share!
`<div ng-controller="ctrl"> <div id="main"> <div ng-class="{'selted':cid == 0}" data-cat="0" selt></div> <div ng-class="{'selted':cid == 1}" data-cat="1" selt></div> <div ng-class="{'selted':cid == 2}" data-cat="2" selt></div> <textarea ng-bind="msg" id="msg"></textarea> </div> <div class="cancel-btn" ng-click="reset()"></div> <div class="submit-btn" ng-click="submit_card()"></div> </div>` in controller,
`app.controller('ctrl', ['$scope', '$compile', function($scope, $compile) { $scope.reset = function(){ //reset depend on scope $('#main div').removeclass('selted'); //the dom maybe change, need clear 'selted' class first //compile(dom)(scope) $('#main').html($compile($('#main').html())($scope)); } $scope.save = function(){ //save scope $scope.msg = $('#msg').val(); $scope.cid = $('.selted').index()+1; } }]); app.directive('selt', function(){ //this directive, change class on dom return function(scope,ele){ ele.click(function(){ ele.addclass('selted').siblings().removeclass('selted'); }) } }); `
1 - need replace ng-bind of textarea ng-model, update scope while typing on it.
2 - provide cancel that, in simple manner, replace ng-click content function, cancel(formname). in controller:
angular.module('exampleapp', []) .controller('ctrl', ['$scope', function ($scope) { $scope.is_hide = false; $scope.msg = null; $scope.cancel = function cancel (form) { $scope.is_hide = true; $scope.msg = null; if (form) { form.$setpristine(); } }; }]); the formname argument name of wrapper form element you're using on html, access specific properties, $setpristine, reset form processing initial state. note: this doesn't mean fields values reseted.
Comments
Post a Comment