在范围内的Angular绑定模型问题？

13 浏览
0 Comments

在范围内的Angular绑定模型问题？

我是Angular JS的新手，正在尝试使用Socket IO和Angular JS与Ionic开发Android平台的聊天应用程序。但是在我的聊天页面上出现了一个问题。

我尝试使用ng-model将文本框绑定到$scope.message变量，但它没有被绑定，因为当我在页面中显示相同变量的值时，它按原样工作，但在控制器中，我得到的值为undefined或者为空。

在index.html中

 
    
        
    
            
  • Welcome to Chat
    • 
            
  • 
                {{chatMessage}}
            
    • 
        

        

             
            
            
            {{message}}

但是当我在控制台上打印该模型时，如果我在控制器的开始处定义它，它显示为undefined，然后它显示为空值。

在Controller.js中

var farmAppControllers = angular.module('farmAppControllers',[]);
farmAppControllers.controller('farmAppController',['$scope','socket',function($scope,socket){
    $scope.messages = [];
    $scope.message = '';
    socket.on("update", function (data) {
        console.log(data);
        $scope.messages.push(data);
    });
    $scope.sendMessage = function (){
        console.log($scope);
        console.log($scope.message);
        socket.emit("msg",$scope.message);
        $scope.messages.push($scope.message);
        $scope.message ='';
    };
}]);

在app.js中

'use strict';
var farmApp = angular.module('farmApp', ['farmAppControllers','farmAppServices','ionic']);

以及Socket包装器的services.js

var farmAppServices = angular.module('farmAppServices',[]);
farmAppServices.factory("socket",function($rootScope){
    var socket = io.connect();
    return {
        on:function (eventName,callBack){
            socket.on(eventName,function(){
                var args = arguments;
                $rootScope.$apply(function(){
                    callBack.apply(socket,args);
                });
            });
        },
        emit:function(eventName,data,callBack){
            socket.emit(eventName,data,function(){
                var args = arguments;
                $rootScope.$apply(function(){
                    if(callBack){
                        callBack.apply(socket,args);
                    }
                });
            });
        }
    };
});

我卡在这里...我试图在Google上搜索解决方法，但无法解决。如果有任何疑问，请随时发表评论。任何帮助都将是非常棒的。

更新：

当我使用此问题的第一个答案时，问题得到解决，但是仍然不清楚为什么ng-submit不起作用？有什么想法吗？因为似乎我仍然无法从控制器更新视图范围？

0