在jquery事件中修改Angular的model

HTML代码如下

<!DOCTYPE html>
<html ng-app="qm">
  <body>
     <input type="button" value="测试" id="btn"> <br />

      <div ng-controller="test_Ctrl">
          <input type="text" id="text_txt" value="{{value}}" echo="{{echo}}"  />
      </div>
   </body>
</html>


<script type="text/javascript" src="script/angular.min.js"></script>
<script type="text/javascript" src="script/jquery-1.8.3.min.js"></script>


初始化angualr

<script type="text/javascript">
    var app = angular.module("qm",[]);
    app.controller("test_Ctrl",function($scope){
         $scope.value="haha";
         $scope.echo="1";
     });


</script>

浏览页面,文本框的初始值为"haha",现在,我想在点击按钮后,修改文本库值,当然不是用jquery的val()方法,该如何做呢

 

$("#btn").on("click",function(){
      
      //获取到文本框对象
       var input = angular.element($("#text_txt"));

      //获取文本框的scope
var scope = input.scope();

//修改value值
scope.value="哈哈";

//方法一: 调用$apply()方法,angular推荐使用
scope.$apply();

//方法二: 调用$digest()方法,不推荐
//scope.$digest();
})

 

你可能感兴趣的:(在jquery事件中修改Angular的model)