javascript - Change $scope value when a ng-click function is triggered -
i tried change $scope variable in angular js's ng-click function. angular
does not seem able that.
below code on appcontroller:
// appcontroller.js $scope email = "awesome@example.com"; $scope.emailinfo = "great@example.com"; //emailonclick() ng-click on dom. triggered when user click button, save email information $scope.emailonclick = function() { $scope.email = $scope.emailinfo; console.log($scope.email); //this print "great@example.com". }; console.log($scope.email); // print "awesome@example.com", //want print "great@example.com" triggered ng-click function //apply change. console.log($scope.emailinfo); //this print "great@example.com".
what miss? thought?
updated:
$scope.emailonclick
function assign $scope.emailinfo
value $scope.email
variable.
if click in «send server» button you'll see new value has been sent in console.
(function() { var app = angular.module("myapp", []); app.controller("controller", ["$scope", function($scope) { $scope.email = "awesome@example.com"; $scope.emailinfo = "great@example.com"; $scope.emailonclick = function() { $scope.email = $scope.emailinfo; // gets emailinfo value , assigns $scope.email. console.log($scope.email); } $scope.sendtoserver = function() { console.log($scope.email); }; console.log($scope.email); // initial state of $scope.email printed default. console.log($scope.emailinfo); // initial state of $scope.emailinfo printed default. } ]); })();
.email { background-image: linear-gradient(#fff, #ccc); border: solid 1px #000; padding: 10px; } .emailinfo { background-image: linear-gradient(#fff, #fbee95); border: solid 1px #000; padding: 10px; } .option-clicked { font-weight: bold; }
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <div data-ng-app="myapp"> <div data-ng-controller="controller"> <div class="email">email: <span class="option-clicked">great@example.com</span> </div> <div class="emailinfo">emailinfo: <span class="option-clicked">{{email}}</span> </div> <button data-ng-click="emailonclick()">get email</button> <button data-ng-click="sendtoserver()">send server</button> <br />result: <input id="txtemail" data-ng-model="email" type="text" /> </div> </div>
Comments
Post a Comment