gpt4 book ai didi

javascript - Angular 不会在 HTML 中显示我的数组结果

转载 作者:行者123 更新时间:2023-11-30 15:28:09 24 4
gpt4 key购买 nike

我的 Angular 有问题...我目前正在使用 socket io 进行简单的聊天广播,但为什么在 socket io 捕获发射后我的数组对象不会显示在 html 中

这是我的 index.html 代码

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body ng-app='BaseModule'>
<div ng-controller="ChatController">
<input type='number' name='sender' ng-model='sender' />
<input type='number' name='to' ng-model='to' />
<textarea name='message' ng-model='message'></textarea>
<button type='button' ng-click='sendMessage()'>send it</button>

<pre>{{ conversation }}</pre>
</div>
</body>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/1.7.3/socket.io.js"></script>
<script type="text/javascript" src="angular.min.js"></script>
<script type="text/javascript" src="base.js"></script>
<script></script>
</html>

这是我的 base.js 的代码

var app = angular.module('BaseModule', []);

app.run(function($rootScope) {
});

app.controller('ChatController', ChatController);

function ChatController($scope){
var self = window.location.hostname;
var socket = io.connect('http://' + self + ':8890');

$scope.to = '';
$scope.message = '';
$scope.conversation = [];

socket.on('connect', function () {
$scope.sendMessage = function(){
var message = {
to: $scope.to,
sender: $scope.sender,
message: $scope.message
};

socket.emit('chat', message);
};
});

socket.on('broadcast', function(data){
$scope.conversation = data;
console.log($scope.conversation);
});
}

这是我的 gulpfile.js

var gulp        = require('gulp');

gulp.task('socketio', function(){
var app = require('express')();
var server = require('http').Server(app);
var io = require('socket.io')(server);
var conversations = [];

server.listen(8890);

io.on('connection', function (socket) {

socket.on('chat', function(data){
conversations.push(data);
console.log(conversations);
socket.emit('broadcast', conversations);
});
});
});

如您所见,我正在通过 gulp 运行我的套接字 io,它确实有效,但问题出在我的 index.html 中的 $scope.conversation,为什么它不改变?

最佳答案

这可能是 $scope 绑定(bind)的问题,因此请尝试在 $scope.conversation = data; 之后添加 $scope.$digest();/p>

关于javascript - Angular 不会在 HTML 中显示我的数组结果,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42643755/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com