错误:ng:areq Bad Argument Argument' msgController'不是一个功能,未定义

时间:2017-03-20 11:04:00

标签: angularjs websocket modal-dialog

我是angularJS的新手,我无法理解为什么会出现这个错误。请帮忙找出我做错的地方。

的index.html

<!DOCTYPE html>
<html ng-app="MyApp">
<head>
    <title>Angular JS Web-Socket</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">        
</head>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.8/angular.min.js"></script>
<script src="js/chat.js"></script>
<script src="lib/ngDialog.js"></script>

<link rel="stylesheet" type="text/css" href="css/ngDialog-theme-default.css">
<link rel="stylesheet" type="text/css" href="css/ngDialog.css">

<body>
    <button ng-controller="MainCtrl" ng-click="openChatBox()">Open</button>
</body>
</html>

chatBox.html

<script src="lib/ngDialog.js"></script>
<script src="lib/angular-websocket.js"></script>
<script src="js/socket.js"></script>
<link rel="stylesheet" type="text/css" href="css/ngDialog.css">
<link rel="stylesheet" type="text/css" href="css/chat.css">
<!-- The Modal -->

<div id="myModal" class="modal" ng-app="chatSocket">

  <!-- Modal content -->
 <div class="modal-content">
  <div class="modal-header">
  <div class="menu">
        <div class="name">Bot</div>
        <div class="close">Close</div>
    </div>
</div>
<div class="modal-body" ng-controller="msgController">
<h2>Modal body</h2>
  <label ng-repeat="item in socket.msg">
      Name : {{item.name}} <br>
      Msg : {{item.msg}}
  </label>
</div>
<div class="modal-footer">
  <h3>Modal Footer</h3>
  <form ng-submit="submit()"> 
    <input type="text" ng-model="msgbox">               
    <button id="sendMsg" type="submit" >Send Message</button>
   </form>
</div>

chat.js

var app = angular.module('MyApp', ['ngDialog']);
app.controller('MainCtrl', function ($scope, ngDialog) {
$scope.openChatBox = function() {
    ngDialog.openConfirm({template: 'chatBox.html',
        scope: $scope //Pass the scope object if you need to access in the template
    }).then(
        function(value) {
            //You need to implement the saveForm() method which should return a promise object
            $scope.closeChat().then(

            );
        },
        function(value) {
            //Cancel or do nothing
        }
    );
};
});

socket.js

angular.module('chatSocket', ['ngWebSocket'])
.factory('socket', function ($websocket) {

    // Open a WebSocket connection
    var ws = $websocket("ws://" + document.location.host + document.location.pathname);
    var msg = [];

    ws.onMessage(function (event) {
        console.log('message: ', event.data);
        var response;

        try {
            response = event.data;
        } catch (e) {
            console.log('error: ', e);
        }

        msg.push({
            name: "Bot",
            msg: response,
        });
    });

    ws.onError(function (event) {
        console.log('connection Error', event);
    });

    ws.onClose(function (event) {
        console.log('connection closed', event);
    });

    ws.onOpen(function () {
        console.log('connection open');
        ws.send('HELLO SERVER');
    });

    return {
        msg: msg,
        status: function () {
            return ws.readyState;
        },

        send: function (message) {
            console.log(message);
            msg.push({
                name: "User",
                msg: message,
            });
            ws.send(message);
        }
    };
 })

.controller('msgController', function ($scope, socket) {
$scope.socket = socket;
$scope.submit = function () {
    socket.send($scope.msgbox);
};  
});

如果我没有使用msgController,则会打开对话框。当我包含它时,会显示错误,并且无法打开对话框。

1 个答案:

答案 0 :(得分:1)

因为您引用了msgController的{​​{1}} openConfirm方法,而您没有定义它。

ngDialog

除此之外,您已在ngDialog.openConfirm({ template: 'chatBox.html', controller: 'msgController', scope: $scope //Pass the scope object if you need to access in the template }) 模块中指定了msgController,并且您正在chatSocket模块中使用它,这就是您收到错误的原因。

您需要将MyApp指定为chatSocket模块的依赖关系,并在MyApp模块上定义msgController,例如打击:

MyApp