具有多个视图的Angular JS UI路由

时间:2019-05-19 08:33:40

标签: javascript java angularjs angular-ui-router

我是新手。我正在尝试创建一个简单的角度应用程序。我想合并UI路由。但是在加载应用程序时会遇到以下错误。

当我使用多个视图时,不会进行UI路由。但是,它适用于单个视图。您能帮上忙吗?

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/1.0.22/angular-ui-router.js"></script>
<meta charset="ISO-8859-1">
<title>Insert title here</title>

</head>
<body>
<div ng-app="myApp">


<div ng-controller="myCtrl">
<input type="hidden" value="getDate" ng-model="user.handleID">
<p>Name</p>
<input type="text" ng-model="user.name">
<br>
<p>Age</p>
<input type="text" ng-model="user.age">
<br>
<br>
<button ng-click="myFunc()">OK</button>

<div ui-view="firstView">First</div>
<div ui-view="secondView">Second</div>
</div>
</div>

<script>
var app=angular.module("myApp", ["ui.router"]);
app.config(function($stateProvider){

    $stateProvider.state('result',{     
        url:'/result',
        views:{
            'firstView@result':{
               templateUrl: '/Registration/html/Result.html'
            },
            'secondView@result':{
               templateUrl: '/Registration/html/Result.html'
            }
        }       
    })
});
//var app=angular.module("myApp", ["ngRoute"]);
app.controller("myCtrl", ["$scope", "$http", "$state", function($scope, 
$http, $state){

$scope.myFunc=function(){
     $http(
        {
        url:'/Registration/RegisterServlet',
        method:'POST',
        contentType: 'application/json',
        data : JSON.stringify($scope.user),
        }
    ).then(function(data){
        console.log(data)
        $scope.result=data.data;
         $state.go("result");
    },function (error){
        $scope.result=data.data;
    }


    );

}

  }]);
</script>

0 个答案:

没有答案