Question

我需要的是当我从子窗口文本框更改值时，反射应该出现在表格中的父窗口记录中。这是我的parent.html。

----- index.html --------

<!DOCTYPE html>
<html>

  <head>
    <script data-require="angular.js@1.4.0-beta.6" data-semver="1.4.0-beta.6" src="https://code.angularjs.org/1.4.0-beta.6/angular.js"></script>
    <link href="style.css" rel="stylesheet"/>
    <script src="script.js"></script>
  </head>

  <body>
  <div ng-app="myApp">
<div ng-controller="PeopleCtrl">
<form  method=post action=''  name=f1>   
<table  border="1" >
    <tr>
        <th>Id</th>
        <th>Name</th>
        <th>Age</th>
        <th> Edit here</th>
    </tr>
    <tr ng-repeat="person in people">
        <td><span id="d" name='p_name'>{{person.id}}</span></td>
        <td><span id="c" name='q_name'>{{person.name}}</span></td>
        <td><span id="e" name='r_name'>{{person.age}}</span></td>
        <td><a href="#" ng-click="foo()">Edit</a></td>
    </tr>
</table>
</form>
</div>
</div>
<script>
var myApp=angular.module('myApp', []);

myApp.controller('PeopleCtrl', function($scope,$window) {

    $scope.people = ([
    {
    id: 1,
    name: "Peter",
    age: 21},
{
    id: 2,
    name: "David",
    age: 20},
{
    id: 3,
    name: "Anil",
    age: 22}
    ])
  $scope.foo = function() {

    $window.open('index1.html');
 };
});
</script>

这是我的孩子窗口：

------ ------- index1.html

    <!DOCTYPE html>
<head>
<script data-require="angular.js@1.4.0-beta.6" data-semver="1.4.0-beta.6" src="https://code.angularjs.org/1.4.0-beta.6/angular.js"></script>
<script>

function post_value(){
opener.document.f1.p_name.value = document.frm.c_name.value;
opener.document.f1.q_name.value = document.frm.d_name.value;
opener.document.f1.r_name.value = document.frm.e_name.value;

self.close();
}

</script>

<title>(Type a title for your page here)</title>
</head>


<body ng-app="mainApp" > 

<div ng-controller='childController'>

  <form name="frm" method=post action=''>
<table border="0">
   <tr><td>Enter  id:</td><td><input id="d"  type="text"   name="c_name" ></td></tr>
   <tr><td>Enter name:</td><td><input id="c"  type="text"   name="d_name" ></td></tr>
    <tr><td>Enter age:</td><td><input id="e"  type="text"   name="e_name" ></td></tr>
   <tr><td><button onclick="post_value();">Save</button></td></tr>
</table>

</form>
</div>
</body>
</html>

这是我的傻瓜：http://plnkr.co/edit/qF2zvp0VYY9wMvWzt3XK?p=preview

Answer 1

您不应该在其他窗口中打开详细信息。然后，您无法在应用中保留数据，因为无法在两个窗口之间进行通信。

我不这么认为你应该把这个事情弄得这么复杂，因为你可以让你成为SPA（单页面应用程序），为此你需要使用ng-route来动态加载页面网址变化的基础。

使用以下html

<div ng-view></div>

然后您需要为您的app编写配置，何时加载哪个模板与哪个控制器

<强>配置

var myApp = angular.module（＆＃39; myApp＆＃39;，[＆＃39; ngRoute＆＃39;]）;

myApp.config(['$routeProvider',
  function($routeProvider) {
    $routeProvider
      .when('/people', {
        templateUrl: 'people.html',
        controller: 'PeopleCtrl'
      })
      .when('/people/:id', {
        templateUrl: 'details.html',
        controller: 'detailsCtrl'
      })
      .otherwise({
        redirectTo: '/people'
      });
  }
]);

Working Plunkr此处

如何更改反映在表中父窗口记录的子窗口文本框中的值？

1 个答案: