如何实现index.html中的Angularjs双向绑定?

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (1)
  • 关注 (0)
  • 查看 (153)

我试图建立一个简单的系统与登录页,它将重定向到另一个页面后,成功登录。

我试图用ng视图(包括登录页面)显示index.html中的所有页面,我尝试使用ng-if来决定何时显示页面顶部的导航栏。

登录后vm.page的值不会更改

index.html

<html ng-app="myApp">
<head>
    <title></title>
    <link href="css/bootstrap.min.css" rel="stylesheet"/>
    <link href="css/custom.css" rel="stylesheet"/>

    <script src="jquery/jquery-3.3.1.min.js"></script>
    <script src="node_module/angular/angular.js"></script>
    <script src="node_module/angular-route/angular-route.js"></script>
    <script src="app.js"></script>
    <script src="controllers/login-controller.js"></script>
</head>
<body>
    <div ng-controller="LoginController as lg" >
        <div ng-if="lg.page != 'Login'" ng-include="'view/navigation-top.html'"></div>
    </div>

    <div ng-view></div>

</body>

.js

angular.module('myApp').controller("LoginController", LoginController);

function LoginController($http, $location, $scope) {
    var vm = this;
    vm.page = "Login";

    vm.login = function(){
        vm.page = "Main";
        $location.path('/')
    }
}

当vm.page被初始化并设置为“Login”时,它可以工作,但是当我将它设置为“main”时,页面不会改变。

提问于
用户回答回答于

问题是$location.path(‘/’)调用你的登录功能。这将导航到/index.html并重新初始化LoginController。因此,vm.page变量被重置为“Login”。

你可以删除location.path()或创建一个服务来实现Page/Login状态。

扫码关注云+社区

领取腾讯云代金券