angular.js - jQuery设置input value Angularjs controller 无法获取

Question

我知道这样做是有违背Angularjs规定的写法的。
先说说场景吧。
用户在A页面点击“新增”按钮，window.open出一个B页面，在B页面填完信息后，点击保存，想要回显到A页面。然后连同A页面一些信息进行提交到controller.
因为刚接触Angularjs，所以还是以页面B opener.document.getElementById 设置父页面（A页面隐藏的input值）。
但是却出现页面上input view是改变了，但是实际的model根本没有变化，controller中取到的值都是 undefined ；
想请教下
1.如果这样的写法，应该怎么操作才能使得controller中可以取到隐藏的B页面回传的input的值。
2.如果遵循Angularjs写法，应该怎么变化？

附A页面：

<a href="javascript:void(0);" ng-click="add()" >新增</a>
<input id = "abv" ng-model="abv" class="intxt" type="text">
<a href="javascript:void(0);" ng-click="save()" id = "save">保存</a>

A.js:

$scope.add = function(){
    var openCustomer =  window.open('B.html');

};
$scope.save = function(){
    console.log('save ' + $scope.abv);

};

页面B：

this.opener.document.getElementById("abv").value = document.getElementById("a").value;
this.opener.document.getElementById("save").click();

Answer 1

只需要给input修改后，再用JQ添加个事件就行了
$("#cert_valid_from").val(date1).trigger('change');
主要是trigger模拟触发change事件

Answer 2

参考代码

A.js：

$scope.add = function() {
        var openCustomer = window.open('B.html');

};

// 这里不用$scope而用window是为了在B页面调用
window.save = function(value) {
    $scope.abv = value;

    alert($scope.abv);
};

B页面

//这里直接调用刚才A.js声明的save方法，然后把B页面的值传进去
opener.save(document.getElementById('a').value);
window.close();

现在 A.js里就alert出来你需要的$scope.abv了。

但仍然要注意的是，这种做法完全是workaround，强烈不推荐

Answer 3

起因，我打算用chrome插件做一个自动帮我点按钮，输入东西的插件，但是那个项目用angular做的，用js设置了input的值还不行，还得更新模型的值，费了好大劲才找到要触发input而不是change，然后又费了好大劲解决跨frame操作的问题。。。。
靠，搞了n久 ，真的费劲千辛万苦才找出的答案，累死我了
终于搞定了，总结下: js修改input值之后，还得触发个事件一开始我以为是change，结果后来历经千辛万苦终于发现是input ,$('input').val(123).trigger('input')就ok了，
但是，我那个项目比较复杂，a.html 通过 iframe 引用了b.html 两个html都有一套jquery和angular,所以要用b.html的jquery触发input才行(也行是bug)，即 window.frames["f1"].contentWindow.$('input').val('55555555555').trigger('input')而不是
$('input',window.frames["f1"].contentWindow.document).val('55555555555').trigger('input')

Answer 4

ngModel 值不更新/显示
参考 http://www.cnblogs.com/whitewolf/p/ngmodel-zhi-bu-geng-xin-slash-xian-shi.html

原因
1.model值不满足表单验证条件,所以angular不会渲染它
2.由于JavaScript特殊的原型链继承机制，对$scope中属性的赋值并不能更新到父$scope

针对原因2 快速解决方案：在ngModel的属性值中加了“.”，那么在JavaScript的原型链检索就会启动了。