Angularjs:我如何将表单中的值传递给其他表单?

时间:2017-11-30 20:58:13

标签: javascript angularjs angular-services angular-controller

我需要从表中获取Id并将其传递给控制器​​,我做了类似的事情,但每次更改表单时都会丢失id值,我想知道是否有办法做到这一点,我添加了服务代码和控制器代码

//Here in get the IdValue

app.controller('SeguimientoSolicitudesController', ['$scope', 'ParametrosSolicitudes', function ($scope, ParametrosSolicitudes) {
        this.SegSolic = "";        
        var self = this;

        $scope.ValorId = function (value) {
            ParametrosSolicitudes.setVarIdSolicitud(value);
            window.location.href = urlServer + "Home/About";
        };


        solicitudContext.obtenerListaSegSolicitudes(function (resp) {
            switch (resp.ressult) {
                case "tgp":
                    self.SegSolic = solicitudContext.ListaSeguimientoSolicitudes;
                    break;
                case "notgp":
                    break;
                default:
                    break;
            }
            $scope.$apply();
        });       
    }]);

//Here i get the detail of the id selected but the value is missing
app.controller('SolicitudesController', ['$scope', 'ParametrosSolicitudes', 'parametroConstante', function ($scope, ParametrosSolicitudes, parametroConstante) {
        this.SolicitudDetalle = "";
        var IdSolicitud = '';
        var self = this;

        $scope.$watch(function () { return ParametrosSolicitudes.getVarIdSolicitud() }, function () {
            IdSolicitud = ParametrosService.getVarIdSolicitud();
        });
        solicitudContext.obtenerListaSolicitudes('R', IdSolicitud, function (resp) {
            switch (resp.ressult) {
                case "tgp":
                    self.SolicitudDetalle = solicitudContext.ListaSolicitudes;
                    break;
                case "notgp":
                    break;
                default:
                    break;
            }
            $scope.$apply();
        });
    }]);

1 个答案:

答案 0 :(得分:0)

Rafa,你有一个概念性问题,当你重新加载页面时,任何JS变量都会丢失,这意味着当你这样做时:

window.location.href = urlServer +"主页/关于"

您正在丢失客户端的所有数据。

然后,为了在AngularJS中从一个页面导航到另一个页面,您应该使用:$ location service,在您的情况下类似于$ location.path(" Home / About");

https://docs.angularjs.org/api/ng/service/ $位置

检查此示例



var app = angular.module('app', ['ngRoute']);

app.config(['$routeProvider', function ($routeProvider) {
  $routeProvider
    .when('/', {
		controller: "SeguimientoSolicitudesController",
		templateUrl: "SeguimientoSolicitudes.html"	
	})
    .when('/details/:id/', {
		controller: 'SolicitudesController', 
		templateUrl: "Solicitudes.html"
	})
}]);

app.service("shareService", function(){
	// lose this value if you reload the page, if you need it persistent you have to save to server or save to browser(cookies, localStorage)
	var name = null;
	
	return {
		getName: function(){
			return name;
		},
		setName: function(val){
			name = val;
		}
	}
})

app.controller('SeguimientoSolicitudesController', ['$scope', '$location','shareService',function ($scope, $location, shareService) {       
	$scope.list = [{id: 5, name: "NameA"}, {id: 9, name: "NameB"}];

	$scope.goToDetails = function(item){
		shareService.setName(item.name);
		$location.path("details/" + item.id);
	}
}]);    
    
app.controller('SolicitudesController', ['$scope','$routeParams','shareService',function ($scope, $routeParams, shareService) {                    
	$scope.id = $routeParams.id;
	$scope.name = shareService.getName();
}]);

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<div class="container"  ng-app="app">
	<ng-view></ng-view>
		
  <script type="text/ng-template" id="SeguimientoSolicitudes.html">
    <p ng-repeat="item in list">
      <a class="btn btn-link" ng-click="goToDetails(item)" style="cursor: pointer;">{{item.name}}</a>
    </p>
  </script>

  <script type="text/ng-template" id="Solicitudes.html">
     <p>ID: {{id}}, NAME: {{name}}</p>
      <a class="btn btn-link" href="#/">back</a>
  </script>
</div>

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.6/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.6/angular-route.min.js"></script>
&#13;
&#13;
&#13;

希望我帮助你