angular input标签只能单向传递数据的问题

angularjs input标签只能单向传递数据的问题

 

 <ion-view title = "{{roomName}}" style = "height:90%;margin-top: 45px " ng-init = "init()"> <ion-pane> <ion-content zooming = "true" class = "no-header"> <ion-list> <ion-item class="item item-input-inset"> <label class="item-input-wrapper"> <input type="text" placeholder="Your Message To Send" ng-model = "myMessage"> </label> <button class="button button-small" ng-click = "sendMyMessage()"> 发送 </button> </ion-item> </ion-list> </ion-content> </ion-pane> <ion-pane style = "margin-top: 55px"> <ion-content zooming = "true" class = "no-header" style = "margin-bottom: 50px"> <ion-list> <ion-item class = "item item-avatar-left my-item" collection-repeat = "message in messages" collection-item-width="'100%'" collection-item-height="75"> <img ng-src="{{message.user.avatarUrl}}"> <h2>{{message.user.name}}:</h2> <p>{{message.content}}</p> </ion-item> </ion-list> </ion-content> </ion-pane> </ion-view> 

我的controller

atMoon.controller('roomCtrl',['$scope','myService', function ($scope, myService) { $scope.sendMyMessage = function () { console.log($scope.myMessage) myService.sendMyMessage($scope, $scope.myMessage) } $scope.init = function () { myService.getMessages($scope); } }]) 

打印的$scope.myMessage一直是undefine,如果我在controller中写上$scope.myMessage = "xxxx"能再界面中显示,所以数据只能从模型到视图,不能从视图到模型,求大神解答万分感谢

 

我怀疑你这是被 scope 的原型继承坑了

像 ion-content 这些指令都是有各自的 scope 的,然后你在视图里写上 ng-model="myMessage" ,其实你在输入框填入的内容是放到了 ion-item 的 scope 上了,而你的 roomCtrl 的 scope 里的 myMessage 依旧是 undefined ;而当你在控制器里给 myMessage 赋值完了以后,由于 ion-item 的 scope 上还没有 myMessage 属性,所以就会从原型链上找,进而找到了 roomCtrl 的 scope 上的 myMessage 。

这是我常用的解决方案:

$scope.ctrlScope = $scope
<input ng-model="ctrlScope.myMessage" />
答案对人有帮助,有参考价值 0答案没帮助,是错误的答案,答非所问

我也遇到了这个问题,貌似事angular.js-1.3.0版本的问题,低版本没出现过,进过测试实验,将myMessage放到一个Object中如下,可以测试通过,也不知道为啥(可能新版angular的优化了watch,watch过多会影响效率):

controller中设置
$scope.Messages={myMessage:""}

 $scope.sendMyMessage = function () { console.log($scope.Messages.myMessage); } <input ng-model="Messages.myMessage" /> 另外我用angular.js正在开发webapp,可以交流下,http://php.xlanlab.com/webapp/mobile-angular-ui-master/my/index.html

 

转载于:https://www.cnblogs.com/shenbin/p/5645022.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值