Angular-UI路由重载模板

Question

我使用的是angular-ui路由，但当嵌套时，它会一次又一次地加载主索引文件，我认为，我在Visual Studio中工作，当我转到该页面时，它开始滞后，但其他页面没有问题

这是routing中的代码：

$stateProvider
    .state("stateOne", {
        url: "/stateOne",
        templateUrl: "/routesDemo/one"

    })
    .state("stateTwo", {
        url: "/stateTwo?donuts",
        templateUrl: function(params) { return "/routesDemo/two?donuts=" + params.donuts; }
    })
    .state("stateThree", {
        url: "/stateThree",
        templateUrl: "/routesDemo/three"

    })
    .state("stateAllProducts", {
        url: "/Products",
        templateUrl: "/product/all",
        controller: ProductJsController

    })
    .state("loginRegister", {
        url: "/loginRegister?returnUrl",
        views: {
            "": {
                templateUrl: "/Account/LoginRegister",
            },
            "login@loginRegister": {
                templateUrl: "/Account/Login",
                controller: LoginController
            },
            "register@loginRegister": {
                templateUrl: "/Account/Register",
                controller: RegisterController
            }
        }
    });

LoginRegister的内容如下：

<div ui-view="login"></div>

<div ui-view="register"></div>

登录

  <div class="col-lg-6">
        <div class="bs-component">
            <form class="form-horizontal" ng-submit="login()">
                <fieldset>
                    <legend>Login</legend>
                    <div class="form-group">
                        <label for="emailAddress" class="col-lg-2 control-label">Email</label>
                        <div class="col-lg-10">
                            <div class="form-control-wrapper">
                                <input type="email" class="form-control empty" ng-model="loginForm.emailAddress" id="emailAddress" placeholder="Email"><span class="material-input"></span></div>
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="password" class="col-lg-2 control-label">Password</label>
                        <div class="col-lg-10">
                            <div class="form-control-wrapper">
                                <input type="password" class="form-control empty" ng-model="loginForm.password" id="password" placeholder="Password"><span class="material-input"></span></div>
                            <div class="checkbox">
                                <label>
                                    <input type="checkbox" ng-model="loginForm.rememberMe"><span class="ripple"></span><span class="check"></span> Remember me?
                                </label>
                            </div>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-lg-10 col-lg-offset-2">
                            <button class="btn btn-default">Cancel</button>
                            <button type="submit" class="btn btn-primary">Submit</button>
                        </div>
                    </div>
                </fieldset>
            </form>
            <div id="source-button" class="btn btn-primary btn-xs" style="display: none;">
                &lt; &gt;
                <div class="ripple-wrapper"></div>
            </div>
        </div>
        <div class="alert alert-dismissable alert-danger" ng-if="loginForm.loginFailure">
            <button type="button" class="close" data-dismiss="alert" ng-click="closeError()">×</button>
            <strong>Oh snap!</strong> <a href="javascript:void(0)" class="alert-link">Change a few things up</a> and try submitting again.
        </div>
    </div>

寄存器

<form ng-submit="register()">
    <label for="emailAddress">Email Address:</label>
    <input id="emailAddress" type="text" ng-model="registerForm.emailAddress" required/>

    <label for="password">Password:</label>
    <input id="password" type="password" ng-model="registerForm.password" required/>

    <label for="confirmPassword">Confirm Password:</label>
    <input id="confirmPassword" type="password" ng-model="registerForm.confirmPassword" required/>

    <button type="submit">Register</button>
</form>

<div ng-if="loginForm.registrationFailure">
    D'oh!
</div>

Answer 1

请提供索引HTML文件。如果你的控制器没有加载，你的视图可能不能被渲染。请同时提供您的一个控制器文件。

您需要用引号将控制器名称括起来，就像它们在控制器中一样。

.state("stateAllProducts", {
        url: "/Products",
        templateUrl: "/product/all",
        controller: ProductJsController

看起来应该是：

.state("stateAllProducts", {
        url: "/Products",
        templateUrl: "/product/all",
        controller: 'ProductJsController'

在没有看到更多代码的情况下，这是我能提供的最好的。