使用angularJs

时间:2019-04-01 10:12:23

标签: angularjs html-table

我有一个输入名称的表格,然后当我单击“提交”按钮时,输入值应显示在表格中。请找到我编写的以下代码。

model.html

<html>
<body ng-controller="myController">
<form ng-submit="addRow()">
<input type="text" ng-model="name"/>
<input type="submit" value="value"/> 
<form/>

<table>
<tr ng-repeat="record in records">
<td>{ {record.name} }<td/>
<tr/>
<table/>
<body/>
<html/>

script.js

myApp.controller('testController,[$scope',function($scope)
{
$scope.records=[];
$scope.addRow = function()
{
$scope.records.push({'name': $scope.name});
};
}]);

但是输出表单元格显示为{{record.name}}。我想在文本框中打印输入的姓名

1 个答案:

答案 0 :(得分:0)

确保修复以下问题:

  • 在html中添加ng-app指令,并在js中定义模块。

  • HTML上的控制器名称与javascript中的名称不同

    • 请确保关闭js和$ scope变量中“ testController”的报价。

这是一个有效的jsFiddle link html:     

  <body ng-app='myApp' ng-controller="testController">
    <form ng-submit="addRow()">
      <input type="text" ng-model="name" />
      <input type="submit" value="value" />
      <form/>

      <table>
        <tr ng-repeat="record in records">
          <td>{{record.name}} <td/>
         <tr/>
       <table/>
   <body/>
<html/>

jacriacript

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

myApp.controller('testController', ['$scope', function($scope) {
  $scope.records = [];
  $scope.addRow = function() {
    $scope.records.push({
      'name': $scope.name
    });
  };
}]);