angulaire.js - Le problème selon lequel les balises d'entrée angulaires JS ne peuvent transmettre des données que dans une seule direction

Question

Mon interface

 <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>

Mon contrôleur

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);
    }
}])

Le $scope.myMessage imprimé est toujours indéfini. Si j'écris $scope.myMessage = "xxxx" dans le contrôleur, il peut être affiché dans l'interface, donc les données ne peuvent passer que du modèle à la vue, pas de la vue au modèle S'il vous plaît Merci beaucoup pour la réponse

Answer 1

Je soupçonne que vous avez été trompé par l'héritage prototypique de Scope

Ces commandes comme ion-content ont leurs propres portées. Ensuite, vous écrivez ng-model="myMessage" dans la vue. En fait, le contenu que vous remplissez dans la zone de saisie est placé sur la portée de ion-item, et vous roomCtrl. dans la portée de myMessage est toujours undefined ; et après avoir attribué une valeur à myMessage dans le contrôleur, puisqu'il n'y a pas d'attribut ion-item sur la portée de myMessage, cela changera de Recherche sur le chaîne de prototypes, puis recherchez roomCtrl sur le périmètre de myMessage.

Voici ma solution préférée :

$scope.ctrlScope = $scope

<input ng-model="ctrlScope.myMessage" />

Answer 2

J'ai également rencontré ce problème. Cela semble être un problème avec la version angulaire.js-1.3.0. Il n'est pas apparu dans les versions inférieures. J'ai fait une expérience de test et mis myMessage dans un objet comme suit. être testé et réussi, je ne sais pas pourquoi (peut-être que la nouvelle version d'Angular a optimisé les montres, trop de montres affecteront l'efficacité) :

Défini dans le contrôleur
$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