angularjs状态无法解析

angularjs state cannot be resolved

本文关键字：状态 angularjs      更新时间：2023-09-26

我正试图在angularjs项目中点击按钮后加载一个新视图。我一直在犯这个错误。如何解决这个问题？由于我是angularjs的新手，我想我已经在我的app.js 中正确地给出了状态

app.js

'use strict';
var app = angular.module('app', ['ui.compat', 'ui.router', 'testCtrl']);
app.config(['$stateProvider', '$urlRouterProvider', '$routeProvider', '$locationProvider', '$httpProvider', function ($stateProvider, $urlRouteProvider, $routeProvider, $locationProvider, $httpProvider) {
        $locationProvider.html5Mode(true);
        $stateProvider
                .state('app.registerPage', {
                    url: "/tp/AddQ",
                    views: {
                        'menuContent': {
                            templateUrl: "views/Registration_view.php",
                            controller: 'testCtrl'
                        }
                    }
                });

        $urlRouteProvider.otherwise('/AEAS/admin/');
    }]);

第一视图

<body>
    <div class="container" ng-controller="testCtrl" ng-app="app">
        <div class="row">
            <form role="form" ng-submit="submit(data)">
                <h1>Welcome to Heart attack predictor!</h1>
                <div id="body">
                    <button><a href=""  ng-click="click();">Edit</a></button>
                </div>
            </form>
        </div>
    </div>
</body>
<script src="<?php echo base_url(); ?>angularjs/angular.min.js"></script>
<script src="<?php echo base_url(); ?>angularjs/angular-ui-router.js"></script>
<script src="<?php echo base_url(); ?>angularjs/angular-route.js"></script>
<script src="<?php echo base_url(); ?>assets/js/app.js"></script>
<script src="<?php echo base_url(); ?>assets/js/Controllers/testCtrl.js"></script>

第二视图

<body>
<div class="container" ng-controller="testCtrl" ng-app="app">
            <div class="row">
                <form role="form" ng-submit="submit(data)">
                    <h1>Welcome to Registration Page</h1>
    <div id="body">
            <button><a href=""  ng-click="submit();">Edit</a></button>
    </div>
                </form>
</div>
</div>
</body>

<script src="<?php echo base_url(); ?>angularjs/angular.min.js"></script>
<script src="<?php echo base_url(); ?>angularjs/angular-ui-router.js"></script>
<script src="<?php echo base_url(); ?>assets/js/app.js"></script>
<script src="<?php echo base_url(); ?>assets/js/Controllers/regCtrl.js"></script>

控制器

angular.module('app', ['ui.router']).controller('testCtrl', ['$scope', '$state', function testCtrl($scope, $state) {

        $scope.click = function () {
            $state.go('app.registerPage');
        };
    }]);

错误

angular.min.js:116 Error: Could not resolve 'app.registerPage' from state ''
    at Object.transitionTo (angular-ui-router.js:3179)
    at Object.go (angular-ui-router.js:3107)
    at m.$scope.click (testCtrl.js:8)
    at fn (eval at <anonymous> (angular.min.js:226), <anonymous>:4:206)
    at b (angular.min.js:124)
    at e (angular.min.js:268)
    at m.$eval (angular.min.js:142)
    at m.$apply (angular.min.js:143)
    at HTMLAnchorElement.<anonymous> (angular.min.js:268)
    at Pf (angular.min.js:36)

您创建了一个无状态视图，因此angular不能从视图"跳转"到app.registerPage状态。我认为您需要创建一个基本（home，index）状态，并将其指向您的第一个视图。

 .state('home', 
         {
            url: "/",
            templateUrl:'views/your_first_view.html',
            controller: "testCtrl"
         });

此外，您需要从第一个视图div中删除ng-controller="testCtrl"。

相关文章：