无法使用 Angular js 将表单字段数据传送到下一个 html 页面答案

【问题标题】：unable to carry form field data to next html page using angular js无法使用 Angular js 将表单字段数据传送到下一个 html 页面
【发布时间】：2017-03-22 16:29:13
【问题描述】：

大家好，我正在尝试使用 Angular js 将其中一个字段值从一个 html 页面传送到另一个页面。下面是代码sn-ps

HTML：

<body ng-app="myApp">

<div ng-controller="ExampleOneController">
    Name:<input type = "text" ng-model="newVar.val">
</div>

<div ng-controller="ExampleTwoController">
    <pre>value of name is {{anotherVar.val}}</pre>
</div>

AngularJS：

var myApp = angular.module("myApp", []);
myApp.controller("ExampleOneController", function($scope, NewsService) {
$scope.newVar = {
val: ""
};
NewsService.newVar = $scope.newVar;
$scope.news = NewsService.news;
});
myApp.controller("ExampleTwoController", function($scope, NewsService) {
$scope.anotherVar = NewsService.newVar;
$scope.news = NewsService.news;
});

如果我将元素放在同一个页面中，它可以正常工作，但如果我将它们放在两个不同的 html 页面中，则不会

我哪里做错了，请帮帮我

谢谢你标记。

【问题讨论】：

您的问题需要澄清。当您说“两个不同的 html 页面”时，您是使用角度路由（http://whatever.com/#/route1、http://whatever.com/#/route2）还是常规路由（http://whatever.com/page1/、http://whatever.com/page2/）？
常规路由
可能与本帖相同：stackoverflow.com/questions/21919962/…

标签： html angularjs angularjs-scope

【解决方案1】：

从您在 cmets 中指定的内容来看，您似乎是在实际页面而不是 AngularJS 页面之间导航。

当您这样做时，您的浏览器基本上会丢弃所有内容并从服务器请求新页面（极端过度简化但仍然有效）。这意味着它还会删除 Angular 应用程序的当前状态并在新页面上重新创建它。

为了避免这种情况，您应该开始使用 Angular 路由，并将需要 Angular 的所有内容保留在单页应用程序 (SPA) 中。

我推荐使用 ui-router，因为我发现它非常有用： https://github.com/angular-ui/ui-router

【讨论】：