天天看點

[Angularjs]ng-repeat中使用ng-model遇到的問題

在ng-reapet中如何為ng-model雙向綁定呢?在項目中确實遇到這樣的問題,綁定了,但是在controller中擷取不到它的值,确實挺奇怪的。

<a href="http://www.cnblogs.com/wolf-sun/p/4614532.html">[angularjs]ng-select和ng-options</a>

<a href="http://www.cnblogs.com/wolf-sun/p/4620150.html">[angularjs]ng-show和ng-hide</a>

<a href="http://www.cnblogs.com/wolf-sun/p/4621854.html">[angularjs]視圖和路由(一)</a>

<a href="http://www.cnblogs.com/wolf-sun/p/4638029.html">[angularjs]視圖和路由(二)</a>

<a href="http://www.cnblogs.com/wolf-sun/p/4640725.html">[angularjs]視圖和路由(三)</a>

<a href="http://www.cnblogs.com/wolf-sun/p/4656216.html">[angularjs]視圖和路由(四)</a>

<a href="http://www.cnblogs.com/wolf-sun/p/4676116.html">[angularjs]ng-class,ng-class-even,ng-class-odd</a>

<a href="http://www.cnblogs.com/wolf-sun/p/4713028.html">[angularjs]單頁應用之分頁</a>

<a href="http://www.cnblogs.com/wolf-sun/p/4732942.html">[angularjs]國際化</a>

有這樣一個人員清單,我們希望單擊按鈕對某人的姓名進行修改,這個時候我們就需要擷取目前對象的某個屬性,代碼片段及視圖如下所示:

[Angularjs]ng-repeat中使用ng-model遇到的問題
[Angularjs]ng-repeat中使用ng-model遇到的問題
[Angularjs]ng-repeat中使用ng-model遇到的問題

一般會這樣寫為按鈕注冊單擊事件,單擊後得到文本框綁定的屬性的新值:

并在controller中編寫方法的實作,以及$http請求服務進行修改資料庫。

這樣單擊按鈕後

[Angularjs]ng-repeat中使用ng-model遇到的問題

并不能識别name屬性。

但是可以通過另外的方法實作

[Angularjs]ng-repeat中使用ng-model遇到的問題

解決辦法:直接将目前對象傳到方法中或者傳屬性p.name。

網上還有另外一種解決方案,但是有個問題。

這種方式在controller中确實可以通過$scope.name拿到文本框的值,但是在視圖中,修改一個其他的也會跟着改變。

最後就出現了這樣的情況:

[Angularjs]ng-repeat中使用ng-model遇到的問題

很明顯這并不是我們想要的結果。

在ng-repeat中ng-model的問題,原因是ng-model對controller中的$scope是不可見的,是以在使用repeat中的某個對象的屬性的時候,最好還是将該對象或者該對象的值傳到方法中。剛接觸angularjs,不知道有沒有更好的解決辦法,這是在項目中遇到的一個問題,記錄在此,希望你有個更好的解決方式,不妨留言,謝謝。

部落格位址:

<a href="http://www.cnblogs.com/wolf-sun">http://www.cnblogs.com/wolf-sun/</a>

部落格版權:

本文以學習、研究和分享為主,歡迎轉載,但必須在文章頁面明顯位置給出原文連接配接。

如果文中有不妥或者錯誤的地方還望高手的你指出,以免誤人子弟。如果覺得本文對你有所幫助不如【推薦】一下!如果你有更好的建議,不如留言一起讨論,共同進步!

再次感謝您耐心的讀完本篇文章。http://www.cnblogs.com/wolf-sun/p/4749854.html