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的原型鏈檢索就會啟動了。