1

web Storm 7.0 を評価しています。デフォルトの localhost:63342 を使用しています。デフォルトのブラウザで最新のクロムを使用しています。

問題: デバッグ モードでは、[コンソール] タブ (デバッガー タブの右側) に、カーソルが点滅しているが編集が無効になっているウィンドウがあります。プログラムにステップインするか、プログラムを実行させても、何も表示されません。

Web Storm コンソールの使用方法に関する簡単なガイドが必要です。行 console.log("adding item to shopping cart"); 実行されないようです。 

<html ng-app="myApp">
<head>
<meta charset="utf-8">
<title>Shopping List AngularJS Tutorial</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.3/angular.min.js">  </script>
<!--<script src="js/appctrl.js"></script>-->
</head>
<body>
 <h1>Shopping List</h1>

 <div ng-controller="AppCtrl">
<p>Using a controller: data.message={{data.message}}!</p>
</div>
<h1>Shopping List</h1>
<form ng-submit="addItem()">
<input type="text" placeholder="item to add" ng-model="itemToAdd" />
<input type="submit" value="add">
 </form>

<br>
<hr>

</div>


var myApp = angular.module('myApp', []);
function AppCtrl($scope) {
    $scope.data={message:'I am a java object data with this message in MyCtrl'};
    $scope.addItem = function() {
        console.log("adding item  to shopping cart");
    };

}

完全なコードについては、google:learnwebtutorials angularjs-tutorial-seriesBatarang を参照してください。このような単純な質問をするのは恥ずかしいですが、何日も立ち往生しています。

編集:これは機能します:

<button onclick="tryConsole()">Try it</button>

<script type = "text/javascript">
  function tryConsole() {
    console.log("hello world");
  }
</script>

どうやら、問題はAngularチュートリアルコード内にある可能性があります:-( ここに画像の説明を入力

4

1 に答える 1

2
  • WebStom のデバッガー コンソールはインタラクティブではありません - 入力できません
  • そこに console.log の出力を表示するのに特別なことは何も必要ありません。Angular.js アプリケーションをデバッガーで実行するだけです。.html ファイルを右クリックして「デバッグ」を選択すると、ページがブラウザーに読み込まれます。テキストフィールドにテキストを入力し、追加を押します - console.log() メッセージがデバッガコンソールに出力されます
于 2013-12-09T13:39:08.927 に答える