Question

有人能告诉我该怎么办？

<html ng-app="plunker">

  <head>
    <meta charset="utf-8" />
    <title>AngularJS Plunker</title>
    <script>document.write('<base href="' + document.location + '" />');</script>
    <link rel="stylesheet" href="style.css" />
    <script data-require="angular.js@1.4.x" src="https://code.angularjs.org/1.4.0-rc.2/angular.js" data-semver="1.4.0-rc.2"></script>
    <script src="app.js"></script>
  </head>

  <body ng-controller="MainCtrl">
    <form name="form.one" ng-submit="submitForm()">
      <input ng-model="name">
      <input type="submit">
    </form>
    <p>Hello {{name}}!</p>


  </body>

我的app.js是

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

app.controller('MainCtrl', function($scope) {
$scope.name = "Name";
var data = {};
$scope.submitForm = function() {

 var data = form.one.name;
};

});

如何将输入保存到数据变量？是否可以保存在按键上？

Answer 1

要将表单与Angular一起使用，您需要进行一些修改才能使此代码正常工作：首先，您需要将novalidate属性添加到表单中;它用于禁用浏览器的本机表单验证。 Angular将使用它自己的验证。以下是其他一些修改（详细解释here）：

<body ng-controller="MainCtrl">
  <form novalidate>
    <input ng-model="name">
    <!-- The method for submitting the data goes on the button. -->
    <!-- The name is passed to the method you want to use to store the data, which you make happen when the button is clicked by using the ngClick directive. -->
    <input type="submit" ng-click="submitForm(name)" value="Click me!">
  </form>
  <p>Hello {{name}}!</p>
  <!-- This bit of code is to display the results of adding names to the array in the browser window: -->
  <pre>{{ data }}</pre>
</body>

这是Javascript：

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

app.controller('MainCtrl', function($scope) {
  $scope.name = "Name";

  // I put the data array in the $scope so it can be displayed in the browser window and you can see the results:
  $scope.data = [];

  // Now, whenever the button is clicked, this method is run.
  // It then stores the name in the 'data' array defined above.
  $scope.submitForm = function(name) {
    $scope.data.push(name);
  };
});

Answer 2

尝试此操作，以便在输入后直接显示：

<body ng-controller="myApp">
    <input type="text" ng-model="name">
    <p>Hello {{name}}!</p>
</body>

使用Javascript：

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

myApp.controller('myApp', function ($scope) {
    $scope.name = $scope.name;
    console.log($scope.name)
});

小小的JSFiddle： https://jsfiddle.net/joshdmiller/HB7LU/

如何在键入angularjs时将输入文本保存到变量

2 个答案: