Параметр не передается на следующую страницу - AngularJS

0

Я хочу передать параметр на следующую страницу, нажав кнопку.

Я пробовал, как показано ниже; на первой странице у меня есть textarea, и я хочу передать это значение на следующую страницу при нажатии кнопки с помощью 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>

Пожалуйста, помогите мне разобраться в этом?

  • 1
    При выполнении window.location = "second.html" вы фактически покидаете первую страницу, поэтому angular не будет иметь никакого представления о данных, введенных вами на первой странице. Я предлагаю вам взглянуть на угловую маршрутизацию здесь: docs.angularjs.org/tutorial/step_07
  • 0
    В дополнение к комментарию @Dola, когда вы покидаете первую страницу, все приложение перезагружается (потому что вы используете js window.location ()), поэтому служба также перезагружается и значение, заданное вами в FirstCtrl, теряется. Как уже было сказано, чтобы это работало, вам нужно развернуть угловую маршрутизацию.
Показать ещё 1 комментарий
Теги:

2 ответа

0
Лучший ответ

Сначала прочтите https://docs.angularjs.org/guide/$location

Удалить функцию send()

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()">
Поделиться
  • 0
    привет, спасибо за помощь, но когда я нажимаю на кнопку, ничего не происходит .. :(
  • 0
    Переместите <input type = "button" value = "send" ng-click = "send ()"> внутри тега div контроллера
Показать ещё 5 комментариев
0

Чтобы отправить параметр на следующую страницу, вам нужно использовать $location.

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

Но опять же это не сработает для вас, поскольку вы не используете AngularJS для маршрутизации, вы используете JS для этого. Я предлагаю следовать этому PhoneCatApp, чтобы изучить Угловые основы

Поделиться
  • 0
    Можете ли вы, пожалуйста, скажите мне, какие изменения кодирования я должен сделать в моем коде?

Ещё вопросы

Сообщество Overcoder
Наверх
Меню