提交带有ng-submit和输出字段的表单

Question

I have a form on a page of my website with a form and upon pressing the submit button I want to output that data to another page of the website. 我的网站页面上有一个带有表格的表格，按下提交按钮后，我想将该数据输出到网站的另一页面。 I can get the value by $scope.title in my controller but I am unsure how I would go about storing it (array?) and output it back to the other page. 我可以在控制器中通过$ scope.title获得值，但不确定如何存储（数组？）并将其输出回另一页。 I am using angularJS. 我正在使用angularJS。

form: 形成：

<div ng-app = "app">
        <form ng-controller = "body" ng-submit="Display()">
            <p>Title</p>
            <input type="text" ng-model="title">
            <p>Author</p>
            <input type="text" ng-model="author">
            <p><input type="submit" value="Submit"></p>
        </form>
</div>

controller: 控制器：

app.controller("body", function ($scope) {
    $scope.setPost = () => {
        $scope.Array = [];
        $scope.Display = () => {
            $scope.Array.push($scope.title);
        }
    };
});

post: 职位：

<div ng-repeat="value in Array">
     {{title}}
</div>

Answer 1

You can try something like the below code, and also check this plunker link for your given example working scenario. 您可以尝试类似以下代码的操作，还可以针对给定的示例工作场景检查此插件链接。

Controller: 控制器：

app.controller('MainCtrl', function($scope, $rootScope) {
  $rootScope.Array = [];
});

app.controller('body', function($scope, $rootScope) {
  $scope.Display = () => {
    var arrayValue = {
      title: $scope.title,
      author: $scope.author
    }
    $rootScope.Array.push(arrayValue);
  }
});

Template: 模板：

  <body ng-controller="MainCtrl">
    <form ng-controller="body" ng-submit="Display()">
      <p>Title</p>
      <input type="text" ng-model="title">
      <p>Author</p>
      <input type="text" ng-model="author">
      <p><input type="submit" value="Submit"></p>
    </form>
    <div ng-repeat="value in Array">
      {{value.title}} by {{value.author}}
    </div>
  </body>

提交带有ng-submit和输出字段的表单

问题描述

1 个解决方案

解决方案1
0 已采纳 2018-10-18 07:41:10

提交带有ng-submit和输出字段的表单

问题描述

1 个解决方案

解决方案1 0 已采纳 2018-10-18 07:41:10

解决方案1
0 已采纳 2018-10-18 07:41:10