参数没有传递到下一页- AngularJS

Parameter not passed to next page - AngularJS

本文关键字：一页 AngularJS 参数      更新时间：2023-09-26

我想在点击按钮时传递一个参数给下一页。

我试过如下;在第一页上，我有一个文本区，我想把这个值传递给下一页的按钮点击使用AngularJS，我已经尝试如下，但它不工作。

index . html 

<!doctype html>
<html ng-app="project">
<head>
    <title>Angular: Service example</title>
    <script src="http://code.angularjs.org/angular-1.0.1.js"></script>
        <script src="sample.js"></script>
</head>
<body>  
    <div ng-controller="FirstCtrl">
        <h2>{{name}}</h2>
        <input ng-model="thing.x"/>         
    </div>
    <input type="button" value="send" onclick="send()">
    <script>
        function send(){
            window.location ="second.html";
        }
    </script>
</body>
</html>

sample.js 

/* 
 * To change this license header, choose License Headers in Project Properties.
 * To change this template file, choose Tools | Templates
 * and open the template in the editor.
 */

var projectModule = angular.module('project',[]);
projectModule.factory('theService', function() {  
    return {
        thing : {
            x : 100
        }
    };
});
function FirstCtrl($scope, theService) {
    $scope.thing = theService.thing;
    $scope.name = "First Controller";
}
function SecondCtrl($scope, theService) {   
    $scope.someThing = theService.thing; 
    $scope.name = "Second Controller!";
}

second.html 

<!DOCTYPE html>
<!--
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
-->
<html>
    <head>
        <title>Passed data</title>
        <script src="sample.js"></script>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width">
    </head>
    <body>
     <div ng-controller="SecondCtrl">
        <h2>{{name}}</h2>
        <input ng-model="someThing.x"/>             
    </div>
        <br>
    </body>
</html>

你能帮我弄明白吗?

先读这个https://docs.angularjs.org/guide/$location

Remove send() function

function FirstCtrl($scope, $location, theService) {
    $scope.thing = theService.thing;
    $scope.name = "First Controller";
    $scope.send = function(){
       $location.path('/second').search({id: 12});
    };
}

<input type="button" value="send" ng-click="send()">

要将参数发送到下一页，必须使用$location服务。

$location.path('/second').search({id: 12});

但是这不会为你工作，因为你不是使用AngularJS路由，你是使用JS。我建议按照这个PhoneCatApp来学习Angular基础知识

相关文章：