angular.js - angular1.x,dom操作与ng数据操作的冲突问题

查看:128
本文介绍了angular.js - angular1.x,dom操作与ng数据操作的冲突问题的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

问 题

http://codepen.io/anon/pen/JXogBj?editors=1010

如上面的代码所示,
点击1:dom操作再点击2:ng操作,标签的值没改,除非点击3:ng操作再点击2:ng操作
有什么方法可以让2:ng操作总是生效?

解决方案

先说明原因

  • 1:dom操作,直接改变的View值,但是$scope.name还是123,没有改变,这点很重要

  • 2:ng操作,因为$scope.name还是123,这个时候赋值123,实际上什么都没干

  • 3:ng操作,$scope.name赋值124,这个时候name改变了,angular回去更新view的值,因为值是一样的所以看不出来效果。再点击2:ng操作,$scope.name赋值123,改变了会同步更新view的值。

有点绕

补充

var helloApp = angular.module("helloApp", []);
helloApp.controller("HelloCtrl", function($scope) {
  $scope.name = "123";  
  
  $('#domopr').click(function(){
    $scope.$apply(function(){
       $scope.name = "124";
    });
  });
});

这篇关于angular.js - angular1.x,dom操作与ng数据操作的冲突问题的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆