无法使用Angular JS将表单字段数据携带到下一个HTML页面

标记

大家好,我正在尝试使用angular js将其中一个字段值从一个html页面传送到另一个html页面。以下是代码片段

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页面中,则效果很好

我在哪里做错了。请帮帮我

谢谢马克。

西蒙·K

根据您在注释中指定的内容,您似乎在实际页面之间导航,而不是在AngularJS页面之间导航。

执行此操作时,浏览器基本上会丢弃所有内容并从服务器请求新页面(极端简化,但仍然有效)。这意味着它还会删除Angular应用程序的当前状态,并在新页面上重新创建它。

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

我建议使用ui-router,因为我发现它非常有用:https//github.com/angular-ui/ui-router

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

无法使用下一个布局

无法输入下一个输入字段-jQuery

Angular Datatable无法使用数据

使用Enter键按下Angular 2专注于下一个输入字段

如何使用HTML5 / Javascript强制光标始终位于一个表单字段中?

无法将数据发送到下一个活动

无法使用android Paging库加载下一个数据

仅一个表单字段无法显示数据库中的值

使用“获取”表单将值传递给Django中的下一个视图

Flask-WTForms使用jQuery移至下一个表单字段

Angular JS 1.x-无法将$ rootScope变量传递给下一个函数

当使用vue.js更改另一个表单字段时,如何有条件地重置表单字段

在flutter中使用StreamBuilder时将数据传递到下一个屏幕

使用javascript以纯HTML格式将表单字段值传送到下一页

将隐藏的值带到下一个HTML页面

使用linq按小时将数据分组并添加下一个日期

如果先前字段为空,则使用先前数据填充表中的下一个字段

为什么我不能使用Node.js和Express将数据从POST发送到下一个呈现页面上的表单?

无法使用angular js删除动态添加的表单字段

当另一个更改使用数据库时更改表单字段

共享服务无法将数据传递给下一个组件

将数据传递给上一个活动并使用相同的按钮移至下一个活动

使用 vba 将数据粘贴到下一个空列中

当 FocusSearch 中的下一个控件无法聚焦在 Telerik 数据表单上时,应用程序崩溃

无法使用 jQuery 从下一个表单中获取输入值

realloc(): 下一个大小无效。无法将 http 页面读入字符串

使用反应形式将表单字段动态添加到 angular 无法正确呈现?

如何使用if下一个条件将for循环结果存储到数据帧

使用下一页和下一个路由器将道具传递到页面?