2015-08-13 4 views
3

Вот его мой HTML кодangularjs: нг клик не работает

<!DOCTYPE html> 
<html> 
<head> 
    <title></title> 
</head> 

<body ng-app="chat"> 
    <div ng-controller="chatCtrl"> 
     <div ng-repeat="i in chatResult"> 
      {{i.first_name}} 
      {{i.last_name}} 
      {{i.id}} 
      {{i.age}} 
     </div> 
     <input type="text" ng-model="message">{{message}} 
     <input type="text" ng-model="username">{{username}} 
     <button ng-click="saveData()">Submit</button> 
    </div> 
    <script src="static/jquery.js"></script> 
    <script src="static/angular.min.js"></script> 
    <script src="static/app.js"></script> 
</body> 
</html> 

В выше HTML код, когда я нажмите кнопку отправить нг щелкните функция не реагирует.

здесь его мой app.js

var chat = angular.module('chat', []) 

chat.controller('chatCtrl', function($scope,$http){ 
    $scope.chatResult = null; 
    $http.defaults.headers.post["Content-Type"] = "application/x-www-form-urlencsoded"; 
    $http.get('http://localhost:3000/chat').success(function(result){ 
     $scope.chatResult = result; 
    }); 

    $scope.message = ''; 
    $scope.username = ''; 
    $scope.saveData = function(){ 
     $console.log('save data function'); 
     $http.post('http://localhost:3000/save/chat/data', {message:$scope.message, username:$scope.username}). 
     success(function(result){ 
      $console.log(result); 
     }); 
    } 
}); 

Когда кнопка нажата представить, я называю угловое событие щелчка, чтобы вызвать функцию сейва.

, но это не работает в моем случае любой проблемы в моем коде ...

+1

что вы имеете в виду _not working_? – Grundy

+0

saveData функция не звонит, когда я нажимаю кнопку отправки. –

+0

попробуйте добавить 'type =" кнопку "' на ваш тег кнопки – Grundy

ответ

5

Я думаю, что называется, на самом деле, но я не уверен в $console.log. Я изменил его на console.log, и я вижу, как функция регистрируется каждый раз, когда я нажимаю кнопку. Проверьте это:

http://plnkr.co/edit/BNuZUe?p=preview

var chat = angular.module('chat', []) 

chat.controller('chatCtrl', function($scope,$http){ 
    $scope.chatResult = null; 
    $http.defaults.headers.post["Content-Type"] = "application/x-www-form-urlencsoded"; 
    $http.get('http://localhost:3000/chat').success(function(result){ 
     $scope.chatResult = result; 
    }); 

    $scope.message = ''; 
    $scope.username = ''; 
    $scope.saveData = function(){ 
     console.log('save data function'); 
     $http.post('http://localhost:3000/save/chat/data', {message:$scope.message, username:$scope.username}). 
     success(function(result){ 
      $console.log(result); 
     }); 
    } 

}); 
+0

спасибо за исправление моего отступа @grundy:) – wesww

+0

Да, он работает над плункером, но в моем случае он не работает. Я использую сервер nodejs - это любая зависимость. –

+0

, в этом случае кажется очень вероятным, что у вас все еще есть другая ошибка JavaScript, которая нарушает выполнение вашего кода, прежде чем вы сможете попытаться запустить эту функцию saveData. У вас есть какие-либо ошибки в консоли? Кроме того, вы пытались нащупывать js для поиска синтаксических проблем? – wesww

0

Угловое имеют различные услуги для печати какие-то вещи в консоли окна браузера. это имя службы $log.

$log служба имеет различные методы, такие как:

  • $log.log(string_value)
  • $log.warn(string_value)
  • $log.info(string_value)
  • т.д.

Таким образом, использовать его как ...

var chat = angular.module('chat', []) 

chat.controller('chatCtrl', function($scope,$http, $log){ 
    $scope.chatResult = null; 
    $http.defaults.headers.post["Content-Type"] = "application/x-www-form-urlencsoded"; 
    $http.get('http://localhost:3000/chat').success(function(result){ 
     $scope.chatResult = result; 
    }); 

    $scope.message = ''; 
    $scope.username = ''; 
    $scope.saveData = function(){ 
     $log.log('save data function'); 
     $http.post('http://localhost:3000/save/chat/data', {message:$scope.message, username:$scope.username}). 
     success(function(result){ 
      $log.info(result); 
     }); 
    } 
}); 
Смежные вопросы